angular.js NG重复 - 检查,如果条件为真,则使用另一个集合 [英] angular.js ng-repeat - check if conditional is true then use another collection

查看:135
本文介绍了angular.js NG重复 - 检查,如果条件为真,则使用另一个集合的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我不知道是否有可能检查 NG-重复内使用的收集?

I'm wondering is it possible to check what collection to use inside ng-repeat?

例如,在我的控制器我有2个阵列从服务器获取数据的,现在我用 NG-开关在它们之间进行切换,检查此jsbin - 的 http://jsbin.com/diyefevi/1/edit?html,js,output

For example, in my controller I have 2 arrays of data fetched from server, now I use ng-switch to switch between them, check this jsbin - http://jsbin.com/diyefevi/1/edit?html,js,output

问题是,在我的实际应用中,这些意见大,但是很相似..所以我真的想为使用1 NG-重复,而不是2

The problem is that these li views in my real application are big but very similar.. so I really would like to use 1 ng-repeat instead of 2.

所以我想如果像 NG-重复=在角,如果列表===adultBooksadultBooks别人预订childBooks是可能的?

So I wonder if something like ng-repeat="book in if list==='adultBooks' adultBooks else childBooks" is possible in Angular?

谢谢!

推荐答案

试试这个...

在您的控制器

$scope.getDataSource=function(condition){

  if(condition){ return dataSource1; }
  return dataSource2;
};

在您的 HTML

ng-repeat="book in getDataSource(/*condition*/)

MVVM模式建议把我们的逻辑总是在控制器,而不是在视图(HTML)。如果你发现自己在视图中添加逻辑,有可能是另一种更好的方式来做到这一点。

MVVM Pattern advises to put our logic always in the controller and not in the view(HTML). If you ever find yourself adding "logic" in your view probably there is an alternate "better" way to do it.

但只是为乐趣的你也可以这样做:

But just for "fun" you can do this too:

ng-repeat="book in {true: adultBooks, false: childBooks}[list==='adultBooks']"

这样的:

<li ng-repeat="book in {true: childBooks, false:adultBooks}[list==='childBooks']">{{book.name}

下面是完整的示例:

<一个href=\"http://jsbin.com/diyefevi/5/edit?html,js,output\">http://jsbin.com/diyefevi/5/edit?html,js,output

这篇关于angular.js NG重复 - 检查,如果条件为真,则使用另一个集合的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆