Question

我的指令代码是：

(function() {
  angular.module('app')
  .directive('dynamicImage', dynamicImage);

  function dynamicImage($timeout) {
    return {
        restrict: 'A',
        scope: { dynamic:'&dynamicImage' },
        link: function (scope, elem) {
          scope.dynamic = function(){
          //code here
          }
        }
    };
}
})();

我的控制器代码是：在控制器中如何调用？

function theMethodToBeCalled() { 
      $scope.dynamic();
}

我的HTML：

<div class="col-xs-12" dynamic-image="theMethodToBeCalled">
    <div class="meet_details_status_img" data-ng-repeat="user in meet.user" data-ng-if="user.extra.invitationStatus === 'pending'">
          <img class="img-circle my-meets-status-img"  ng-src="{{ user.displayPicture ? (imageURL + user.id) : 'assets/images/user_thumb.jpg' }}"
          />
     </div>
</div>

请帮助我。

由于

Answer 1

您可以expose从controller到directive的对象，并可以在directive中定义该对象内的方法。由于您可以访问在指令中公开的对象，因此您可以调用directive中定义的任何方法。

示例 -

(function() {
  angular.module('app')
  .directive('dynamicImage', dynamicImage);

  function dynamicImage($timeout) {
    return {
        restrict: 'A',
        scope: { dynamic:'&dynamicImage',methodList:'=' },
        link: function (scope, elem) {
          scope.methodList.dynamic = function(){
          //code here
          }
        }
    };
}
})();

在控制器中

function CtrlFun($scope){
   $scope.methodList = {};
   $scope.callDirectiveMethod = function(){
      $scope.methodList.dynamic();
   }
}

<强> HTML

<div dynamic-image method-list="methodList"> </div>

如何从控制器调用指令的功能

1 个答案: