javascript - 使用 ng-repeat 映射嵌套值

标签 javascript angularjs

我有以下代码,我使用 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"}];


}

因此在上面的示例中,异常(exception)的输出是:

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/

关于javascript - 使用 ng-repeat 映射嵌套值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35293783/

相关文章:

css - 你如何在 Angular-UI-Bootstrap 中缩放轮播容器的大小

java - 安全漏洞 : How to avert them?

angularjs - 如何使用$resource从本地json文件获取数据

javascript - 存储函数调用结果以供以后引用

javascript - 通过在其外部点击来模糊 <TextInput/>,在 native react 中不起作用

javascript - Bootstrap Multiple - 从服务器设置选定的值

ajax - 从网站表单写入谷歌文档时遇到 CORS 错误

html - 如何在 CSS 中组合两个 Angularjs 表单验证指令条件?

javascript - 当页面中包含 iframe 时,Kendo 移动滚动不起作用

Javascript:向表单输入数据时,提交按钮未激活