json 使用 ng-repeat 打印所需数据

Question

我是编码新手，我从 angular js 开始....

我有一个 json 如下所示

$scope.data={
    "items":
        {
            "yamaha":
                {
                   "title":"R15",
                   "description":"sports mode",
                   "speed":"180kmph"
                },
            "Tvs":
                {
                   "title":"apache",
                   "description":"sports mode",
                   "speed":"150kmph"
                }
        }
};

现在我的要求是在html中一个接一个地显示每个值......

备注正如我所说的，我是新手，我用谷歌搜索了这个并找到了一些像 ng-repeat 这样的信息，但我不明白如何在实施时使用它。

感谢您的回复

Answer 1

ng-repeat 将遍历给定数组中的数据....这里我使用键、vakue 概念来打印对象键和值

<!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 src="http://code.angularjs.org/1.1.4/angular.js"></script>
  <script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
 <div ng-repeat="(k,v) in data.items">

    <div><h2>{{k}}</h2>
        <p>{{ v.title }}</p>
        <p>{{v.description }}</p>
        <p>{{v.speed }}</p>
    </div>


</div>
</body>
  <script>
    var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.data={
        "items":
            {
                "yamaha":
                    {
                       "title":"R15",
                       "description":"sports mode",
                       "speed":"180kmph"
                    },
                "Tvs":
                    {
                       "title":"apache",
                       "description":"sports mode",
                       "speed":"150kmph"
                    }
            }
    };
  
  
});
    </script>
</html>

json 使用 ng-repeat 打印所需数据

json print required data with ng-repat

ng-repeat