Javascript Angularjs ng repeat：在特殊对象字段上迭代

我有一个目标：

var options = {
    NAME_1 : "Name 1",
    TEXT_1 : "Description goes here",
    NAME_2 : "Name 2",
    TEXT_2 : "Description2 goes here",
};

是否可以在ng repeat中迭代对象的字段？ 例如

{{item.name}
{{item.text}

如有任何建议，我将不胜感激

---

提前谢谢。

绝对感谢！使用以下语法：

<div ng-repeat="(k, v) in options">

---

您可以猜到，

k

是键，

v

是键的值。

绝对！使用以下语法：

<div ng-repeat="(k, v) in options">

---

正如你所猜测的，

k

是键，

v

是键的值。

这不会像你想象的那样起作用，也许你的对象会像这样

var options = [
{
name : "Name 1",
text : "Description goes here"
},
{
name : "Name 2",
text : "Description2 goes here"
}
];

现在，您可以根据需要进行迭代

或者，我猜您可以迭代对象中的所有值，但是您需要记住，除了在同一个对象中之外，这些值实际上并不相互关联

这是使用ng if和迭代对象的解决方案。但正如我所提到的，javascript对对象的迭代不是按顺序进行的，所以最好在数组中对属性重新排序，然后再次迭代。下面迭代为NAME_1、NAME_2、TEXT_1、TEXT_2

app.controller('MainCtrl', function($scope) {
  var options = {
    NAME_1 : "Name 1",
    TEXT_1 : "Description goes here",
    NAME_2 : "Name 2",
    TEXT_2 : "Description2 goes here",
};
$scope.options = options;
$scope.check = function(title, key) {
   if(key.split('_')[0] === title) {
     return true;
   } 
}
});

<div ng-repeat="(k,v) in options|orderBy:k">
    <span ng-class="title" ng-if="check('NAME',k)">{{k}}</span>
    <span ng-class="text" ng-if="check('TEXT',k)">{{k}}</span>     
</div>

app.controller（'MainCtrl'，函数（$scope）{
变量选项={
名称1：“名称1”，
文本_1：“此处有说明”，
名称2：“名称2”，
文本2：“说明2在此显示”，
};
$scope.options=选项；
$scope.check=功能（标题、键）{
if（键拆分（“”“）[0]==标题）{
返回true；
} 
}
});
{{k}
{{k}

完整解决方案： 如果还使用下划线，则可以执行此操作

<div ng-repeat="x in optionsArray">
      <span ng-class="title" ng-if="check('NAME',x)">{{x[1]}}</span>
      <span ng-class="text" ng-if="check('TEXT',x)">{{x[1]}}</span>
</div>

app.controller('MainCtrl', function($scope) {
  var options = {
    NAME_1: "Name 1",
    TEXT_1: "Description goes here",
    NAME_2: "Name 2",
    TEXT_2: "Description2 goes here",
  };
  $scope.options = options;
  $scope.optionsArray = _.pairs(options);
  $scope.check = function(title, key) {
    if (key[0].split('_')[0] === title) {
      return true;
    }
  }

});

{{x[1]}
{{x[1]}
应用程序控制器（'MainCtrl'，函数（$scope）{
变量选项={
名称1：“名称1”，
文本_1：“此处有说明”，
名称2：“名称2”，
文本2：“说明2在此显示”，
};
$scope.options=选项；
$scope.optionsArray=\.pairs（选项）；
$scope.check=功能（标题、键）{
if（键[0]。拆分（“”“）[0]==标题）{
返回true；
}
}
});

这不会像你想象的那样起作用，也许你的对象看起来像这样

var options = [
{
name : "Name 1",
text : "Description goes here"
},
{
name : "Name 2",
text : "Description2 goes here"
}
];

现在，您可以根据需要进行迭代

或者，我猜您可以迭代对象中的所有值，但是您需要记住，除了在同一个对象中之外，这些值实际上并不相互关联

这是使用ng if和迭代对象的解决方案。但正如我所提到的，javascript对对象的迭代不是按顺序进行的，所以最好在数组中对属性重新排序，然后再次迭代。下面迭代为NAME_1、NAME_2、TEXT_1、TEXT_2

app.controller('MainCtrl', function($scope) {
  var options = {
    NAME_1 : "Name 1",
    TEXT_1 : "Description goes here",
    NAME_2 : "Name 2",
    TEXT_2 : "Description2 goes here",
};
$scope.options = options;
$scope.check = function(title, key) {
   if(key.split('_')[0] === title) {
     return true;
   } 
}
});

<div ng-repeat="(k,v) in options|orderBy:k">
    <span ng-class="title" ng-if="check('NAME',k)">{{k}}</span>
    <span ng-class="text" ng-if="check('TEXT',k)">{{k}}</span>     
</div>

app.controller（'MainCtrl'，函数（$scope）{
变量选项={
名称1：“名称1”，
文本_1：“此处有说明”，
名称2：“名称2”，
文本2：“说明2在此显示”，
};
$scope.options=选项；
$scope.check=功能（标题、键）{
if（键拆分（“”“）[0]==标题）{
返回true；
} 
}
});
{{k}
{{k}

完整解决方案： 如果还使用下划线，则可以执行此操作

<div ng-repeat="x in optionsArray">
      <span ng-class="title" ng-if="check('NAME',x)">{{x[1]}}</span>
      <span ng-class="text" ng-if="check('TEXT',x)">{{x[1]}}</span>
</div>

app.controller('MainCtrl', function($scope) {
  var options = {
    NAME_1: "Name 1",
    TEXT_1: "Description goes here",
    NAME_2: "Name 2",
    TEXT_2: "Description2 goes here",
  };
  $scope.options = options;
  $scope.optionsArray = _.pairs(options);
  $scope.check = function(title, key) {
    if (key[0].split('_')[0] === title) {
      return true;
    }
  }

});

{{x[1]}
{{x[1]}
应用程序控制器（'MainCtrl'，函数（$scope）{
变量选项={
名称1：“名称1”，
文本_1：“此处有说明”，
名称2：“名称2”，
文本2：“说明2在此显示”，
};
$scope.options=选项；
$scope.optionsArray=\.pairs（选项）；
$scope.check=功能（标题、键）{
if（键[0]。拆分（“”“）[0]==标题）{
返回true；
}
}
});

我无法修改对象。这是3D第三方服务返回的方式。我在考虑结合ng if并在循环中使用“odd”参数。这行不通，因为javascript不是以有序的方式迭代对象属性。我编辑了我的答案，不过也是为了回答你的问题。所以你可以做一些工作，我不能修改这个对象。这是3D第三方服务返回的方式。我在考虑结合ng if并在循环中使用“odd”参数。这行不通，因为javascript不是以有序的方式迭代对象属性。我编辑了我的答案，不过也是为了回答你的问题。所以你可以做一些工作。我用一个完整的解决方案编辑了我的答案。我用一个完整的解决方案编辑了我的答案。你可以使用任何你喜欢的有效标识符，当然，不仅仅是“k”和“v”。当然，你可以使用任何你喜欢的有效标识符，而不仅仅是“k”和“v”。