ビューポートでレンダリングされた場合、アトリビュート値でangle ui-grid cellTemplate関数を排他的に評価する方法は？

Question

私はangularjsとui-gridをカスタムcellTemplateで使用しています。各セルのオブジェクトはCOL_FIELDです。このオブジェクトはのsrc属性で使用されるimage data uriを返す関数に渡され、各セルは画像をレンダリングします。

私は、次のようにカスタムcellTemplateを定義するときにことに気づいた：

<img src="{{grid.appScope.getCachedImg(COL_FIELD)}}" /> 

...すべてが動作しますが、グリッドがそれになる遅い表示されるすべてのセルと、すべての行のための機能が評価されます応答する。

<img src="https://dummyimage.com/30x30/000/fff&text={{COL_FIELD.attributes.displayName[0]}}" /> 

...これは私がビューポート内の細胞のみがサーバー呼び出しを行うたいという意味で動作します。私は、次のセルテンプレートをしようとしたテストのため

。

この違いの理由は何ですか？どのようにしてこの2番目の動作をすることができますが、それを返すサーバコールの代わりにimage data uriを返す関数があります。ビューポートのセルだけがスクロールアップまたはダウンしてこれを要求していますか？

Answer 1

特に30x30を使用する場合、base64イメージを使用しないのはなぜですか？はいそれは私が使用しているものですが、私はしたくドント

{ 
    image: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD//gA7Q1JFQVRPUjogZ2QtanBlZyB2MS4wICh1c2luZyBJSkcgSlBFRyB2NjIpLCBxdWFsaXR5ID0gNzAK/9sAQwAKBwcIBwYKCAgICwoKCw4YEA4NDQ4dFRYRGCMfJSQiHyIhJis3LyYpNCkhIjBBMTQ5Oz4+PiUuRElDPEg3PT47/9sAQwEKCwsODQ4cEBAcOygiKDs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7/8AAEQgAIAAgAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/aAAwDAQACEQMRAD8A2rvUorSB5pnVFVSfmOM4Ga5WPx219cPBa6c7nHDF8Ko9WOPlHvW3rmmLNDcGRYZIrZPMfz5dsffKyAqfqMc5z06Vy8MNlcxvcxQuLF2PkxzY8y55HLkAHywR8q98DPGBXDClG2p1ym76FxfEN3dzb7aNY7EA/wCkSAlpTn+BcjKjpuPBx+FWktLu7KPvESEj593mSH39vwwKl0y2t2dLm7nAcMCcpkYHYD0+lP1TWdN8iVLK1EbOR5kucMw4PbtyOPx7VtCEE9hS5rGfr2pajrot5NRkS3tmH7uxt/mEeSBud/4n68Dp+NaN/pk10IJLCNBGqBVUHsB2PTHHrXPTxXFuZInO+2VgY2B5X1BH9av23iF9NsppLhribao8kR4G055ZjkEgD0z9RWdOpGeqNJU3TdpItL4e1i4DAhYhgHoT39RwPzq9ZeE7eINPcSmfa7HORsAIAwT90Hr/ABH6VXg1+aaFJJLmCKMgMCUVyfzLEflmnT67aZDyy3F7KORk4UHtgt0A9NvWtbozv2R//9k=" 
} 

Plunker