使用 ng 重复映射嵌套值

Mapping nested values with ng-repeat

本文关键字:嵌套 映射 ng 使用      更新时间:2023-09-26

我有以下代码,我使用 ng-repeat 循环和映射一些 json 值,rows是 json 数据,其中columns与我要显示的键匹配:

function MyCtrl($scope) {
    $scope.rows = [{"name": "tom","date": "now"}, {"name": "jack","date": "now"}]; 
    angular.toJson($scope.rows);
    $scope.columns = [{"title":"Title","field":"name"},{"title":"Date","field":"date"}];

}

.HTML:

<div ng-app ng-controller="MyCtrl">
  <div ng-repeat="row in rows">
        <div ng-repeat="column in columns">
            {{row[column.field]}}

        </div>
      </div>
</div>

示例:http://jsfiddle.net/dakra/U3pVM/

我的问题是:如何显示/表示嵌套值。这就是我想要实现的目标:http://jsfiddle.net/GCSHA/10/我使用 user.company 获得公司名称的地方。

例如:

function MyCtrl($scope) {
    $scope.rows = [{"name": "tom", "user": {"company": "test"}}]
    $scope.columns = [{"title":"Title","field":"name"},{"title":"Company","field":"user.company"}];

}

因此,在上面的例子中,例外输出是:

Tom
Test

您可以使用小实用程序方法来重复读取属性。

像这样:

$scope.readProperty = function(obj, prop) {
            var newObj = obj;
    var props = prop.split('.');
    for(var i = 0; i<props.length; i++) {
            newObj = newObj[props[i]];
    }
    return newObj;
}

这里的工作示例:http://jsfiddle.net/GCSHA/12/

问题是{{row[column.field]}}转换为{{row[user.company"]}}。这是不正确的。应该是{{row[user][company]"]}}