md-virtual-repeatで動的にフォントをロード

Question

こんにちは私は、既存の配列からフォントを動的に読み込む問題に直面しました。

私はすべてのフォントをGoogleフォントから取得します。次に、md-virtual-repeatを使ってフォントをレンダリングします。各要素には、rt-fontというディレクティブを使用し、このディレクティブのlink関数は、Web Font Loaderという必要なフォントファミリをロードします。ここで問題が始まります。 Link関数は、最初の要素からではなく、フォントの読み込みを開始します。正しくフォントスタイルを適用していない要素のいくつかは、それらのいくつかは、私がcodepen hereを持っていること

をクリックするまでfont.nameをレンダリングしません。 だから私は、私は誰かが私がやるべきか、何のシーケンスでのロジックを説明するために私を助けることができる動的なフォントの負荷の一部でロジックを破壊され、ここで

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）それらをリピートリストでレンダリングし、フォントスタイルを正しく適用します。 私が見逃したのは、遅延ロードを使用するべきかもしれません...

Answer 1

私は私の問題を発見し、md-virtual-repeatを取り除きました。 md-virtual-repeatの代わりにfork of angular infinite scrollを使用しました.HTMLにしか影響しないことがわかったので、DOM要素を非表示にして表示します。それがうまくいくので、http要求のオーバーロードを避けるために、僕の巨大なフォント配列にlimitToフィルタを追加しました。同じものがagnular font selectで使用されます。 私のデモフォントピッカーが動作するようになりました。間違いなく最適化とリファクタリングが必要ですが、アルファ版では問題ありません。