AngularJs用于ng-options的条件显示

时间:2013-10-02 06:00:23

标签: javascript angularjs ng-options

我一直在寻找几个小时,似乎无法在任何地方找到我的问题的答案。我记得以前我能够实现它但由于某种原因我丢失了代码而我似乎无法记住我做了什么使其工作。

我正在尝试使用ng-options从选择框中的数组中显示数据。那个我没有问题。我需要实现的是,只有某些数组值将显示/包含在选择框中。

我的数据如下:

$scope.chartList = [ { "id" : 1, "name" : "chart 1", "order" : 1, "active" : false },
                     { "id" : 2, "name" : "chart 2", "order" : 2, "active" : true },
                     { "id" : 3, "name" : "chart 3", "order" : 3, "active" : true },
                     { "id" : 4, "name" : "chart 4", "order" : 4, "active" : true }, 
                     { "id" : 5, "name" : "chart 5", "order" : 5, "active" : true } ];

我的HTML看起来像:

<select ng-model="toAddChart" ng-options="chart.id as chart.name for chart in chartList | filter:chart.active=='false'">
  <option value=""></option>
</select>

所以我想要发生的是,如果属性“active”的值为false,那么它是唯一一次将数组项显示/包含在选择列表中。我尝试了过滤器属性的不同排列,但似乎都没有。

我知道我可以轻松地在标签中使用ng-repeat并使用ng-show但我记得在某处(再次,我找不到位置)读取它并不是实现它的正确方法和使用ng-options是正确的方法。

我真的很确定我之前没有创建自定义javascript过滤器就可以做到这一点,但对于我的生活,我不记得我是怎么做到的。我希望有人可以

希望有人可以帮助我,因为我没有想法。

更新

伟大的斯科特,我想我已经得到了它。

而不是:

filter:chart.active=='false'

应该是:

filter:chart.active='false'

这只是使用的等号的数量。 捂脸

感谢大家的回复。

3 个答案:

答案 0 :(得分:19)

伟大的斯科特,我想我已经得到了它。

而不是:

filter:chart.active=='false'

应该是:

filter:chart.active='false'

它只是使用的等号数。捂脸

感谢大家的回复。

答案 1 :(得分:2)

嘿反而更好用

ng-options =“chart.id as chart.name for chartList in chartList | filter:{active:true}”

答案 2 :(得分:-1)

这有效。

filter:chart.active==false

http://jsfiddle.net/H6AZ2/116/