Arahan placeholder gambar js sudut tidak memperbarui gambar src saat menambahkan data baru

Saya punya arahan seperti ini.. diambil dari sini

Cara menampilkan gambar placeholder sebelumnya gambar aslinya diunduh?

Petunjuk

angular.module('starter').directive('hires', function() {
  return {
    restrict: 'A',
    scope: { hires: '@' },
    link: function(scope, element, attrs) {
        console.log(scope.hires)
        if(element.attr("pictype")=="dp"){
            element.attr('ng-src', "img/profile-placeholder.png");  
            element.attr('src', "img/profile-placeholder.png");    
        }else if(element.attr("pictype")=="general"){
           element.attr('ng-src', "img/placeholder.png");  
            element.attr('src', "img/placeholder.png");  
        }

        element.one('load', function() {

            element.attr('ng-src', scope.hires);
            element.attr('src', scope.hires);
            element.unbind('load');
        });
    }
  };
})

Saya menggunakannya seperti ini

<div ng-repeat="img in images">
   <img ng-src="" pictype="general" hires="{{post.images.images[0]}}">
</div>

atau seperti ini

<div ng-repeat="img in images">
   <img ng-src="" pictype="general" hires="{{post.images.images[0]}}">
</div>

berfungsi dengan baik ketika saya pertama kali memuat array dengan 10 data dari server.. semua gambar unik. tetapi ketika saya mendorong atau membatalkan pergeseran gambar baru dalam larik gambar, gambar terakhir akan ditampilkan.

Bagaimana cara menyegarkan arahan.


angularjs angularjs-directive
person Raj Sharma    schedule 17.06.2016    source sumber

Jawaban (1)


arrow_upward
1
arrow_downward

Anda perlu memperhatikan atribut yang memiliki data:

angular.module('starter').directive('hires', function() {
    return {
        restrict: 'A',
        scope: { hires: '@' },
        link: function(scope, element, attrs) {
            scope.$watch('hires', function(value) {
                myFunction(value);
            });
            function myFunction(images) {
                //rest of the code from you directive
            }
        }
    }
})
person James    schedule 17.06.2016