javascript - Angular JS ng-if 不在 ng-repeat 内工作

标签 javascript angularjs

我在范围内有一个对象数组,我正在使用 ng-repeat 对其进行循环。我想根据一些元素的值过滤掉它们,但似乎 ng-if 被完全忽略了。

我设置了这个简单的例子来说明:http://plnkr.co/edit/Aj0hpZQTfnkQ6BYG8DRb .
这是 Controller :

var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.events = [
    {key: "ClassName", value: "exception", age:12},
    {key: "Message", value: "oops", age: 25},
    {key: "Stack", value: null, age: 35}
    ]
});

以及 HTML 模板:

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="30515e57455c51421e5a4370011e001e48" rel="noreferrer noopener nofollow">[email protected]</a>" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" data-semver="1.0.8"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <ul>
      <li ng-repeat="event in events" ng-if="event.age > 20">
        [{{$index + 1}}] {{event.key}}: {{event.value}} - {{event.age}}
      </li>
    </ul>
  </body>

</html>

ng-if 指令应该过滤掉数组的第一个元素,无论如何它都会显示。我错过了什么而忽略了 ng-if?

最佳答案

我认为正确的方法是使用过滤器,例如:

<li ng-repeat="event in events | filter:greaterThan">

工作示例:http://plnkr.co/edit/Qy3BVEogEgGivtqel73b?p=preview

关于javascript - Angular JS ng-if 不在 ng-repeat 内工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19924384/

相关文章:

javascript - 我如何修改 Angular 图表js中的刻度标签?

javascript - 是否可以将 Mutation Observer 与三个 js 元素 - A 框架一起使用?

javascript - 使用 Gridview + 格式打印模态框

javascript - 如何根据 ng-repeat 中选定的颜色更改 div 的背景颜色

javascript - 如何检测用户登录 Facebook?

javascript - 如何从 HTML 按钮调用一些 JavaScript

javascript - 获取 Angular 中文本字段的值

regex - UI-Router 的简单正则表达式路由约束

javascript - Grunt uncss 忽略 javascript 生成的 css

javascript - AngularJS 表达式不起作用