在 ng-init 中添加过滤器

Question

<input ng-model="search.name" placeholder="Name" />

<tbody>
<div ng-init="FilteredGeojson = ho|filter:search">
<tr ng-repeat="hf in FilteredGeojson">
    <td>{{ hf.name }}</td>   
</tr>
</div>
</tbody>
</table>
<div leaflet-directive id="map" data="FilteredGeojson"></div>

如果可能的话，在 ng-init 中进行过滤很重要，但我无法解决它，我无法进行 ng-repeat 并创建我传递给指令的范围，因为它开始无限摘要循环。

Answer 1

您问题的答案

您的代码段无效，因为 ho 和 filter:search 是不同的语句。在

ng-init="FilteredGeojson = ho | filter:search"

...分配 FilteredGeojson = ho 在应用过滤器 | filter:search 之前完成，这不起作用。

你需要像这样封装过滤值：

ng-init="FilteredGeojson = (ho | filter:search)"

还有

It is important to do filtering in ng-init

重要的是什么？ ngInit 指令只会在那里被调用一次，因此当您更新过滤器时，ngRepeat 中的项目不会被更新。但是你需要这个，对吧？

要实现这一点，您应该在 ngRepeat 指令中添加过滤器，如下所示：

<tr ng-repeat="hf in FilteredGeojson | filter:search">
    <td>{{ hf.name }}</td>   
</tr>

例子

两种解决方案都可以在 this plnkr example 中找到。

Answer 2

我以 Sharikov Vladislav 为例。顺便谢谢你。

对我来说，只有在没有 "filter" 的情况下才有效：

<div class="centerdivConteneur" ng-init="$root.breadcrumb.label = '<li><a href=\'#\'>Index</a></li><li>' +('Plan du site'|translate)+'</li>'">

(此页面没有控制器)

Answer 3

这里不需要 ng-init，而是临时使用 ng-repeat。
这是更新后的 plnkr.

这是plnkr中的index.html。

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link href="style.css" rel="stylesheet" />
  <script data-semver="1.3.13" src="https://code.angularjs.org/1.4.8/angular.js" data-require="angular.js@1.3.x"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">

  FilteredGeojson.length :- {{FilteredGeojson.length}}
  <br>
  <input ng-model="search" placeholder="Name" /> {{ search }}
  <table >
    <tr ng-repeat="item in (FilteredGeojson = (Geojson | filter:search))">
      <td>{{ item.name }}</td>
    </tr>
  </table>
</body>


</html>

FilteredGeojson 将在您使用输入框更改作用域上的 search 变量时更新。我更新了 plnkr 来显示这个。

另外，如果Geojson数组是一个长数组，你可以像这样使用limitTo过滤器。

<tr ng-repeat="item in (FilteredGeojson = (Geojson | filter:search)) | limitTo: 5">

请告诉我是否有帮助。

在 ng-init 中添加过滤器

Add filters in ng-init

angularjs

angularjs-ng-repeat

angularjs-ng-init

您问题的答案

还有

例子