Question

我是棱角分明的新手并且想知道是否可以用变量替换ng-repeat指令中的firstP？我正在使用AngularJS v1.6.6

ng-repeat="option in people['firstP']"

var people = {
    "firstP": [
        "",
        "James",
        "Jack",
    ], 
    "SecondP": [
        "",
        "Bill",
        "Bob",
    ]
};

Answer 1

是否可以用变量？
替换ng-repeat指令中的firstP

是的，在您使用Angular中的常规javascript 对象括号表示法之后，可以用变量替换firstP。

<强>解决方案：

如果您尝试动态显示people对象内容，则可以这样做：

<div ng-repeat="(key, value) in people">
  <select>
    <option ng-repeat="option in people[key]">{{option}}</option>
  </select>
</div>

首先，您需要遍历people对象keys，然后为每个key获取相关的array，然后循环显示每个array以显示它的内容。

注意：

请注意，我们可以直接在people[key]中将value替换为ng-repeat，使其变为ng-repeat="option in value"。

我刚才使用people[key]来回答您的具体问题。

<强>演示：

这是一个现场工作Plunker。

Answer 2

我认为您必须将people对象分配给$ scope变量才能访问html中的people对象。

<强> HTML

<html ng-app="myApp" ng-controller="testCtrl">
  <ul>
        <li ng-repeat="name in people[element]">{{name}}</li>
    </ul>
</html>

<强> JS

var app = angular.module('myApp', []);

var testCtrl = function($scope){
    $scope.element = 'firstP';
    $scope.people = {
       "firstP" : [
          "Jake",
          "James",
          "Jack",

      ], 
      "SecondP" : [
          "",
          "Bill",
          "Bob",

      ]};
}

app.controller('testCtrl',['$scope',testCtrl]);

检查https://jsfiddle.net/0zk4mfak/6/

Answer 3

根据我的理解，使用$ scope变量在控制器中定义数组：在控制器中：

app.controller('nameCtrl', function($scope) {
    $scope.people = { firstP: ['james', 'jack'] };
});

在Html中：

<div ng-controller="nameCtrl">
    <ul>
            <li ng-repeat="option in people.firstP">{{option}}</li>
        </ul>

</div>

试试这个。希望它有帮助..！

Answer 4

您的代码看起来很可疑，因为它会填充一个选择（下拉列表）框。如果是这种情况，请使用ng-options for Angular 1：

在$ scope上给出这个项目数组：

$scope.items = [{
  id: 1,
  label: 'aLabel',
  subItem: { name: 'aSubItem' }
}, {
  id: 2,
  label: 'bLabel',
  subItem: { name: 'bSubItem' }
}];

这将有效：

<select ng-options="item as item.label for item in items track by item.id"
        ng-model="selected"></select>

$scope.selected = $scope.items[0];

像ngFor in Angular 2中的

或this answer：

<select name="selectmake" [(ngModel)]="makeListFilter">
    <option *ngFor="let muscleCar of muscleCars" [ngValue]="muscleCar">
        {{muscleCar.name}}
    </option>
</select>

是否可以在ng-repeat中传递变量？

4 个答案: