属性変更時の再初期化指示

Question

私は2つの指示文を持っており、第1指示文から第2指示文を呼び出しています。

これは私の第一ディレクティブ

var initializeWidget = function ($compile, $timeout, $rootScope) { 
    return { 
     restrict: 'EA', 
     scope: { 
      maxImages: '@', 
     }, 
     link: function (scope, element, attrs) { 


      if (!scope.cloudinaryFolder) { 
       throw 'folder value is missing in image uploader directive'; 
      } 
      if (!scope.cloudinaryTags) { 
       throw 'tags value is missing in image uploader directive'; 
      } 
      //1 
      attrs.$observe('maxImages', function (newMaxImages) { 
       console.log('varun==' + newMaxImages); 
       $timeout(function() { 

        angular.element(document.body).append($compile('<div class="sp-upload-widget" sp-upload-widget up-max-images="' + scope.maxImages + '"></div>')(scope)); 
        scope.$apply(); 
       }, 10); 
      }); 
     } 
    }; 
}; 

私は上記のコードで使用angular.elementをusixng私の第二のディレクティブを呼び出しています。

以下

私の第二のディレクティブです：私のコントローラで今

var spUploadWidget = function ($q, Cloudinary, ENV) { 
    var templateUrl; 
    if ('dev' === ENV.name) { 
     templateUrl = '/seller/modules/uploadWidget/views/upload.html'; 
    } 
    else if ('prod' === ENV.name) { 
     templateUrl = './views/upload.html'; 
    } 
    return { 
     restrict: 'AE', 
     scope: {}, 
     bindToController: { 
      maxImages: '=?upMaxImages', 
     }, 
     replace: false, 
     controller: 'uploadWidgetController', 
     controllerAs: 'up', 
     templateUrl: templateUrl, 
    }; 
}; 

私はmaxImagesの値をチェックしていたときに、それが更新された値を与えているが、私はAPIを呼び出すために、この変数を使用していたときに、それが保持していますより古い価値。ここに私のコントローラ

console.log('up===' + self.maxImages); 
    self.openUploader = function() { 
     self.closeModal(); 
     ABC.UploaderInit(self.maxImages); 
    }; 

は私が

<div initialize-widget max-images="maxImages"></div> 

私のディレクティブでmaxImagesの値を変更するときにそれは私のABC.UploaderInit機能に

Answer 1

を更新された値を与えるべきである私のための解決策を見つけました問題は、 私は2番目のディレクティブを呼び出すので、私は私のディレクティブの複数のインスタンスを作成していたので、最初のディレクティブの属性が変更されたときに私はこの問題を抱えていた。

これで私は2番目の指令を呼び出す前に2番目の指令の古いインスタンスを破棄しています。

   $rootScope.$on('destroySpUploadWidget', function (event, args) { 
       if (args.modalId === ctrl.modalId) { 
        scope.$destroy(); 
        element.remove(); 
       }