14

ng-src 属性を持つ画像がビューポートに表示されるまで読み込まれないようにしたいと考えています。

これはAngularで可能ですか？

以前はjQuery LazyLoad Pluginを使用していましたが、Angular と jQuery の両方を使用せずにこれを実行しようとしています。

4

3 に答える 3

5

まだ興味がある場合は、github でこのレポを見つけました: https://github.com/afklm/ng-lazy-image

私はそれを試してみましたが、それは揺れます！

画像はビューポートに表示されたときにのみ読み込まれ、画面サイズに基づいて読み込む画像を選択できます。これは、モバイル ユーザー向けに小さい画像をロードできることを意味します ;)

于 2015-07-27T19:10:20.380 に答える
0

要素が表示されている場合にのみ値を返すゲッターにソースをバインドできると思います（imgの可視性をトリガーするために何らかのバインディングを使用していると仮定します）。

たとえばng-src="{{getImgSource()}}"、コントローラーで and を使用します。

scope.getImgSource = function(){
    if(scope.showImg){
        return "myImageUrl.png";
    }
    return ""; 
};

ただし、それが頻繁に使用する必要がある場合は、それを行うための独自のディレクティブを作成することを検討する必要があります。

于 2013-08-02T07:53:03.603 に答える