Question

我在嵌套循环中有一个名为suggest的组件：

<div ng-repeat="phrase in model.phrases track by $index">
    <div ng-repeat="word in phrase.words track by $index">
        <suggest phrase-index="$parent.$index" word-index="$index"></suggest>
    </div>
</div>

我需要从根范围操作组件的数据。这样做的最佳方式是什么？

我的主要问题是通过phrase-index和word-index找到正确的组件实例。虽然通常我会写$('suggest[phrase-index="0"]')之类的东西，但在这种情况下它不起作用，因为属性值仍为"$parent.$index"。

另一部分不清楚是在找到它后调用组件上的方法。现在我正在使用$（element）.children（）。scope（）获取范围引用并在其上调用方法，但是文档说scope（）只应该用于调试。什么是更好的方式？

我有可能这样做太多了，并且有更好的方法。我只是不想在多个组件/服务忙于在层之间传递方法调用来过度设计它。

Answer 1

您可以在$ rootScope上发出一个事件，并在组件控制器中定义的事件列表中调用组件方法。

应用程序中的某处发出具有所需组件实例的索引值的事件：

$rootScope.$emit('suggestEvent', someIndexValue);

并在组件控制器中定义事件侦听器调用组件方法，如果phrase-index等于事件中传递的索引值：

 //inside suggest component controller
 $rootScope.$on('suggestEvent', function(index) {
       //call component method if 'index' value is equal to  component `phrase-index`
      if (this.phraseIndex === index) {
          this.someMethod();
      }
 })

Angular 1.5：在ngRepeat中调用组件的方法

1 个答案: