Question

简单的问题 - 如果我在控制器中有这个：

$scope.somedata = 'Item 1, Item 2'; // set from something else

有没有办法在ngRepeat表达式中为我的视图拆分somedata？类似的东西：

<div ng-repeat="item in somedata | split(',')">{{item}}</div>

哪个不起作用......

或者我必须这样做

$scope.somedata = 'Item 1, Item 2'; // set from something else
$scope.items = somedata.split(',');

然后

<div ng-repeat="item in items>{{item}}</div>

我想我并不是真的理解我在AngularJS中的表达式中能做些什么。

Answer 1

我想我太晚了，但为什么不简单地这样做：

<div ng-repeat="item in somedata.split(',')">{{item}}</div>

工作正常。

JSBin获取证据！

Answer 2

|右侧的字符串被解析为过滤器的名称（通常它们是字符串格式化过滤器，但角度团队还提供了filter过滤器，它返回一个过滤后的数组（有点误导，因为两者共享相同的名称）。您可以创建自己的拆分过滤器来完成您想要的任务：

angular.module('myFilters', []).
  filter('split', function() {
    return function(input, delimiter) {
      var delimiter = delimiter || ',';

      return input.split(delimiter);
    } 
  });

您可以像这样使用过滤器：

<div ng-repeat="item in somedata | split">

或指定分隔符：

<div ng-repeat="item in somedata | split:,">

考虑上面的伪代码，因为我还没有测试过它。

Le plunker：http://plnkr.co/edit/hk6F0Y6p5YAXv6fyXfSz?p=preview

Answer 3

在这里评论分隔符

angular.module('myFilters', []).
  filter('split', function() {
    return function(input, delimiter) {
      //var delimiter = delimiter || ',';

      return input.split(delimiter);
    } 
  });

您可以像这样使用过滤器：还添加了$ index跟踪，以避免因重复值导致崩溃

<div ng-repeat="item in somedata | split:',' track by $index">

拆分ng重复项目？

3 个答案: