您好我遇到了从现有阵列动态加载字体的问题。
我从谷歌字体中获取所有字体。然后我使用md-virtual-repeat来渲染字体。在每个元素上我使用指令rt-font
,该指令的link函数将所需的字体系列加载到Web Font Loader。这里开始出现问题。链接功能开始加载字体而不是第一个元素。一些元素没有正确应用字体样式,其中一些元素直到点击它才会呈现font.name
我有codepen here。 所以我假设我在动态字体加载的一部分中打破了逻辑并在这里渲染
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_;
}
}
}
}
Pls有人可以帮助我解释我应该怎样做以及以什么顺序做的逻辑: 1)从数组部分加载5个元素的字体 2)在重复列表中渲染它们并正确应用它们的字体样式。 我错过了,也许我应该使用延期加载或......
答案 0 :(得分:0)
我发现了我的问题并摆脱了md-virtual-repeat
。我使用fork of angular infinite scroll而不是md-virtual-repeat
,因为我发现它只影响html,它只是隐藏并显示DOM元素。因为它的工作原理,我只是在我的巨大字体数组上添加了limitTo
过滤器,以避免重载http请求。同样的事情在agnular font select中使用。
现在我的演示字体选择器工作。绝对有优化和重构的东西,但作为阿尔法版本它是好的。