Question

如何在$ scope变量中定义动态ng-repeat，如下所示：

$scope.radioOptions =[{value:1,name:'radio1'},{value:2,name:'radio2'}];
$scope.item = {
    model: "radio", 
    radioOptions:'opt in radioOptions',
    optValue:'value',
    optLabel:'name'
}

并在html中使用它：

<div class="radio radio-info radio-inline" ng-repeat="item.radioOptions">
      <input type="radio" id="{{$index}}" ng-value="item.optValue" name="{{item.model}}">
       <label for="{{$index}}">{{item.optLabel }}</label>
 </div>

但是我错了

错误：[ngRepeat：iexp] documentation

现在，如何使用此规范创建动态ng-repeat？

Answer 1

尝试动态生成无线电，

  $scope.radioOptions =[{value:1,name:'radio1'},{value:2,name:'radio2'}];

  $scope.item = {
      model: "radio", 
      radioOptions:$scope.radioOptions,
      optValue:'value',
      optLabel:'name'
  }

并在html中：

<div class="radio radio-info radio-inline" ng-repeat="option in item.radioOptions">
     <input type="radio" id="{{$index}}" ng-value="option[item.optValue]" name="{{option[item.model]}}">
     <label for="{{$index}}">{{option[item.optLabel]}}</label>
</div>

Answer 2

我解决了获取数组名称然后返回数组集合的函数的问题：

$scope.radioOptions =[{value:1,name:'radio1'},{value:2,name:'radio2'}];
$scope.item = {
    model: "radio", 
    radioOptions:'radioOptions',
    optValue:'value',
    optLabel:'name'
}

// get array collection by name
$scope.getCollection = function (name) {
        return $scope[name];
    };

并将html更改为：

<div class="radio radio-info radio-inline" ng-repeat="opt in getCollection(item.radioOptions)">
      <input  type="radio" id="{{$index}}" ng-value="opt[item.optValue]" name="{{item.model}}">
      <label for="{{$index}}">{{opt[item.optLabel] }}</label>
</div>

在text $ scope变量中定义的动态字符串ng-repeat

2 个答案: