Question

我在angular JS中有一个像这样的数据：

controller.js

 someControllers.controller('viewDetail',function($scope){
       $scope.list = [{
          "id":"1",
          "first_name":"Super",
          "last_name":"Admin",
          "email":"superadmin@123.com",
          "status":"1",
          "is_superadmin":"1"
       }];
    });

现在我想以这种方式将这些数据打印到我的视图中

view.html

<dl>
   <dt>id</dt>
   <dd>1</dd>
   <dt>first_name</dt>
   <dd>super</dd>
   <dt>last_name</dt>
   <dd>Admin</dd>
   <dt>email</dt>
   <dd>superadmin@123.com</dd>
</dl>

依旧......

请告诉我如何才能做到这一点。 ng-repeat对我不起作用。

注意：
json对象的内容可以是动态的。

Answer 1

首先，您需要将JSON分配给对象，而不是直接分配$ scope

someControllers.controller('viewDetail',function($scope){
       $scope.list = [{
          "id":"1",
          "first_name":"Super",
          "last_name":"Admin",
          "email":"superadmin@123.com",
          "status":"1",
          "is_superadmin":"1"
       }];
    });

在该对象上使用 ng-repeat 。

<dl ng-repeat="item in list">
   <dt>id</dt>
   <dd>{{item.id}}</dd>
   <dt>first_name</dt>
   <dd>{{item.first_name}}</dd>
   <dt>last_name</dt>
   <dd>{{item.last_name}}</dd>
   <dt>email</dt>
   <dd>{{item.email}}</dd>
</dl>

更新：

如果JSON字段未知，则循环遍历每个JSON对象。

<div class="boredered-box" ng-repeat="item in list">
      <dl ng-repeat="(key,value) in item">
         <dt>{{key}}</dt>
         <dd>{{value}}</dd>
      </dl>
    </div>

Plnkr Link

在Angular Js中的dd dt标签中打印数据

1 个答案: