1

您好,我遇到了从现有数组动态加载字体的问题。

我从谷歌字体中获取所有字体。然后我使用md-virtual-repeat来渲染字体。在我使用指令的每个元素上,该指令的链接功能使用Web Font Loaderrt-font加载所需的字体系列。问题就从这里开始了。链接函数不是从第一个元素开始加载字体。一些元素没有正确应用字体样式,其中一些元素在单击之前不会呈现 font.name

在此处输入图像描述

这里有codepen。所以我假设我在部分动态字体加载和渲染中破坏了逻辑

vm.infiniteItems = {
  items: [],
  numLoaded_: 0,
  toLoad_: 0,
  maxLen: 810,
  // Required.
  getItemAtIndex: function(index) {
    if (index > this.numLoaded_) {
      this.fetchMoreItems_(index);
      return null;
    }
    return this.items[index];
  },
  // Required.
  getLength: function() {
    return this.numLoaded_ + 5;
  },
  fetchMoreItems_: function(index) {
    if (this.toLoad_ < index) {
      this.toLoad_ += 5;
      if (this.toLoad_ <= this.maxLen){
        var partOfFonts = vm.fonts.slice(this.numLoaded_, this.toLoad_);
        this.items =  this.items.concat(partOfFonts);
        this.numLoaded_ = this.toLoad_;
      }
    }
  }
}

请有人帮我解释我应该如何以及以什么顺序执行以下操作的逻辑:1)从数组部分加载字体ин 5个元素2)在重复列表中渲染它们并正确应用它们的字体样式。我错过了什么,也许我应该使用延迟加载或......

4

1 回答 1

0

我发现了我的问题并摆脱了md-virtual-repeat. 我使用了角度无限滚动的 fork而不是md-virtual-repeat,因为它只影响 html,它只是隐藏和显示 DOM 元素。我刚刚limitTo在我的巨大字体数组上添加了过滤器,以避免 http 请求过载。angular font select中使用的相同。现在我的演示字体选择器可以工作了。肯定有需要优化和重构的东西,但作为 alfa 版本还可以。

于 2017-01-07T19:29:22.277 回答