Question

在Angular 1.2中，ngRepeat中的元素可以看到父作用域的函数（isConvoTabActive）。但是，在我切换到1.3后，这不再有效。我检查了迁移指南但没有找到任何内容。如何在不使用$ parent.isConvoTabActive？

的情况下解决此问题

app.directive('myDirective',function(){
  return {
    restrict: 'E',
    scope: {
    },
    controller: ["$scope", "$element", "$attrs",
      function($scope, $element, $attrs) {
          $scope.isConvoTabActive = function(convoId) {           
            return convoId == $scope.indexes.activeConvoId;
          };
      }
    },
    template: "<div ng-repeat='(convoId, convo) in convos'>" +
                  "<div ng-if='isConvoTabActive(convoId)'></div>" +
              "</div>",
    replace: true, // replace the directive element
    link: function (scope, element, attrs) {
            scope.indexes = {
                "activeConvoId": "111"
            };
            scope.convos = {
               "111": {
                 "title": "convo 111" 
               },
               "222": {
                 "title": "convo 222"
               }
            };
    }       
  }
})

EDIT1   我试过ng-show，它也不起作用。

EDIT2   它适用于Plunker。我不知道为什么。   http://plnkr.co/edit/7pdp40CQzUqOISwXgN4u

Answer 1

作为一种可以减少重构的替代解决方案，您可以使用ng-show（只要您的元素从DOM中隐藏而不是删除就没有问题）。 ng-show不会创建子范围。

Answer 2

您可以使用控制器作为语法，以便您明确地引用模型/控制器。我的手机上没有方便的链接，或者想要输入代码示例，但它应该很容易找到。

bindToController属性（对于您的指令）是摆脱$ scope需求的关键。它会将您的指令属性绑定到控制器实例。

Answer 3

好的，所以这是我使用controller-as的意思的一个例子：

app.directive('myDirective',function() {
  return {
    restrict: 'E',
    scope: {
      indexes: '='
    },
    controllerAs: 'ctrl',
    bindToController: true,
    controller: function() {
      var model = this;
      model.isConvoTabActive = function(convo) {           
        return convo == model.indexes.activeConvo;
      };
    }
  },
  template: "<div ng-repeat='convo in ctrl.convos'>" +
              "<div ng-if='ctrl.isConvoTabActive(convo)'></div>" +
            "</div>"
  }
});

我已将此添加为另一个答案，因为格式和空间在评论中有限。我知道我不知道某些东西来自哪里或它们包含什么，例如在哪里＆＃39; convos＆＃39;受范围约束？这就是为什么我认为一个傻瓜会有所帮助。我还在另一个答案中讨论了变化：只比较对象引用而不是ID值（当在范围继承链中向下复制值类型时会出现问题）。

迁移到AngularJs 1.3，ng中的子元素重复不再看到指令范围

3 个答案: