Question

我的指令看起来像这样：

<div ng-controller="searchController" searchbar>
   <input type="text" id="searchfield" ng-model="myVar">
   <div searchresult>
       <div ng-repeat="data in data.menu | filter: myVar">
           {{data.title}}
       </div>
   </div>
</div>

有一个名为searchController的控制器，以及两个名为searchbar和searchresult的指令。

如何使用searchbar指令在searchresult指令中运行函数？我正在考虑将require: "^searchresult"置于searchbar指令中并将其称为函数。这是正确的做法吗？如果searchresult在那里不可用怎么办？

以下是详细信息方案：

当用户在输入字段中输入内容时，过滤器会更新搜索结果。因此searchresult div的高度会发生变化。

searchresult指令如何知道高度和高度的变化？立即运行所需的功能？

Answer 1

searchResult可以引用searchBar而不是相反。从文档

^ - 通过搜索元素及其来找到所需的控制器父母。如果找不到则抛出错误。

另请查看^?的可选依赖项。请参阅compile文档。

如果您详细说明您的方案，我们可以提供更好的帮助。

更新：根据您概述的方案，您可以直接在searchresult指令中查看myVar属性，无论何时更改，您都可以触发调整结果大小的函数。

假设searchresult指令不创建隔离范围。您可以在指令链接函数

中尝试这样的代码

scope.$watch('myVar',function(newValue) {
   $timeout(function() {
       //do some work here
   },0);
});

超时有助于我们无法确定列表的呈现何时完成。

Angular嵌套指令通信

1 个答案: