Question

我有CKEDITOR，一个控制器和一个指令。这是控制器的方法，应该从<span>添加ng-show并删除ng-hide：

   $scope.deleteEditorAndSave = () ->
    angular.forEach CKEDITOR.instances, (editor) ->
      id = editor.element.getAttribute('data_id')
      text = editor.getData()
      field = editor.element.getNameAtt()

      html_field = $(editor.element.$)
      html_field.val(text)

      showing = editor.element.getAttribute('ng-show')
      console.log showing
      $timeout( ->
        html_field.trigger('input')
        $scope.save_field(text, id, field, 'no_call')
        editor.destroy()
        angular.forEach allClaims(), (claim) ->
          console.log "CLAIM", claim
          claim[showing.split('.')[1]] = false
      )

我想从指令中调用此方法。当我尝试这样做时，<span>元素不会重新渲染。有谁知道如何解决这个问题？

提前致谢。

Answer 1

我认为建议的做法是在指令中解析DOM，一旦可以帮助你的东西是具有隔离范围的指令，这将允许你在指令范围内使用&，如下所示：

<body ng-controller="MainCtrl">
  <div user-name="" callme="enableEditor()"></div>
  <div>
  <a href="#" ng-click="enableEditor()">add</a>
  </div>
<script>

var myApp = angular.module('myApp', []);

 myApp.controller('MainCtrl', ['$scope', function ($scope) {
    $scope.enableEditor = function() {
        alert("123");
    };  
}]);
myApp.directive("userName", function() {
    return {
            restrict: "A",
            scope: {
                value: "=userName",
                callme:"&"
            },
            template: '<div class="click-to-edit">' +
            '<a href="#" ng-click="callme()">Edit</a>' +
            '</div>'
        };
});

属性callme="enableEditor()"用于将方法传递给scope指令，指令范围使用&来表示方法callme:"&"。另一个例子：

method2="someMethod()"喜欢

scope: {
      value: "=userName",
      callme:"&",    
      method2:"&"
},template: '<div class="click-to-edit">' + '<a href="#" ng-click="callme()">Edit</a>' + '<a href="#" ng-click="Method2()">Save</a>' + '</div>'

这是与控制器通信指令的推荐方法。

如何在指令中监视控制器方法

1 个答案: