角度ng-repeat表达式作为变量

Gil*_*lad 16 expression directive angularjs ng-repeat

我正在尝试做这样的事情:

<ul>
    <li ng-repeat="{{myRepeatExpression}}">{{row.name}}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

但由于ng-repeat逻辑处于指令的编译状态,因此它将其{{myRepeatExpression}}视为普通字符串而不是变量.显然,哪个不起作用.

那有什么解决方法吗?

Liv*_* T. 11

您只能使用和表达ng-repeat而不是interpolated值.现在,为了创建动态可重复列表,您可以尝试:

  1. 使用一个动态返回列表的函数ng-repeat- 这可能更昂贵,因为角度需要先调用函数然后确定集合在执行$digest循环时是否已更改
  2. $watch对于触发更改列表的范围上的特定变量 - 可能更有效但如果您的动态列表依赖于多个变量,它可能会变得更加冗长并且可能导致潜在的错误,$watch因为在新变量时忘记添加新变量是必须的

演示人员

JS:

app.controller('MainCtrl', function($scope) {
  var values1 = [{name:'First'}, {name:'Second'}];
  var values2 = [{name:'Third'}, {name:'Fourth'}, {name:'Fifth'}];

  //1. function way
  $scope.getValues = function(id) {
    if(id === 1) {
      return values1;
    }
    if(id === 2) {
      return values2;
    }
  }

  //2. watch way
  $scope.values = undefined;
  $scope.$watch('id', function(newVal) {
    $scope.values = $scope.getValues(newVal);
  });
});
Run Code Online (Sandbox Code Playgroud)

HTML:

<!-- Here we pass the required value directly to the function -->
<!-- this is not mandatory as you can use other scope variables and/or private variables -->
<ul>
  <li ng-repeat="v in getValues(id)">{{v.name}}</li>
</ul>
<!-- Nothing special here, plain old ng-repeat -->
<ul>
  <li ng-repeat="v in values">{{v.name}}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)