Question

我正在尝试使用AngularJS中的搜索功能（在Ionic框架中）。我有一个模板，包含不同的视图和所有视图的公共标题。在每个视图上，使用JSON显示不同的列表。我想为每个视图使用搜索功能。

 <form class="form-inline">
      <div class="form-group">
          <input type="text" ng-model="search" class="form-control" placeholder="Search">
      </div>
 </form>

<ion-item class="item-button-right item-avatar item-icon-right item item-thumbnail-left" ng-repeat="text in texts|filter:search" type="item-text-wrap" href="#/otherContent/texts/{{text.id}}">

如果我在一个视图中使用上述搜索form和ion-item，则此代码可以正常工作。但是，如果我在搜索栏中添加搜索表单并将<ion-item>标记放在不同的页面中，则无效。

我希望这有道理吗？任何人都可以建议我们如何实现这一点。我需要在标题中使用搜索栏，这对于所有视图都是通用的，它应该在加载时搜索每个视图。任何指针都非常受欢迎。

Answer 1

如果你有一个顶级控制器添加到html或body标签（如果没有，那么定义一个顶级控制器，如GlobalController并将其添加到你的{{1} }}或<html>标记，以便我们可以将全局数据保存在那里，并且它的范围可以在应用范围内全局访问。基本上我们正在尝试避免<body>使用并模仿{ {1}}用法。），然后在该全局控制器中定义一个空对象：

$rootScope

然后，将$rootScope更改为：

 $scope.globalModel = {};

最后修改您的搜索过滤器，如：

ng-model

以上应该有效。我们在这里做的是在父范围内定义一个对象，以便我们可以防止Angular Scopes Inheritance的问题。

在角度js中使用搜索功能

1 个答案: