显示包含另一个数组

时间:2016-06-29 22:52:27

标签: angularjs

我试图通过angularJs显示包含另一个数组的数组的内容。下面的代码不起作用。我不确定我在这里做错了什么。请告诉我。

链接:https://plnkr.co/edit/Bp8MJXczii0HVjujZ6Xe?p=preview

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.3/angular.js" data-semver="1.4.3"></script>
    <script src="app.js"></script>
    <script>
      var app = angular.module('plunker', []);
      app.controller('MainCtrl', function($scope) {
        $scope.items = [
          [{"a":"1", "b":"2", "c":"3"}],
          [{"a":"4", "b":"5", "c":"6"}],
          [{"a":"7", "b":"8", "c":"9"}]
        ]
      });
    </script>
  </head>
  <body ng-controller="MainCtrl">
    <div ng-repeat="item in items">
      <ul>
        <li ng-repeat="i in item.items">
          {{i.a}},{{i.b}},{{i.c}}
          </li>
      </ul>
    </div>
  </body>
</html>

2 个答案:

答案 0 :(得分:1)

您的数据结构无效。您对[]

的对象使用{}

更改为

    $scope.items = [
      {"a":"1", "b":"2", "c":"3"},
      {"a":"4", "b":"5", "c":"6"},
      {"a":"7", "b":"8", "c":"9"}
    ]

现在你有一个重复的数组

答案 1 :(得分:0)

正确的代码将是

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.3/angular.js" data-semver="1.4.3"></script>
    <script src="app.js"></script>
    <script>
      var app = angular.module('plunker', []);
      app.controller('MainCtrl', function($scope) {
        $scope.items = [
          [{"a":"1", "b":"2", "c":"3"}],
          [{"a":"4", "b":"5", "c":"6"}],
          [{"a":"7", "b":"8", "c":"9"}]
        ]
      });
    </script>
  </head>
  <body ng-controller="MainCtrl">
    <div ng-repeat="item in items">
      <ul>
        <li ng-repeat="i in item">
          {{i.a}},{{i.b}},{{i.c}}
          </li>
      </ul>
    </div>
  </body>
</html>

这对我有用