在Angular中使用嵌套的JSON数据

时间:2019-03-25 10:57:49

标签: json angularjs nested

对于角度测试来说是新手,只是尝试一下。

我正在尝试使用嵌套的JSON数据。下面是一个例子。这些值未在html中输出,但在我为其创建JSON对象之前就已经输出了。我想念什么?

var app = angular.module('ops', []);

app.controller('access', function($scope) {

    $scope.links = [
    {
      logon: 'Logon',
      setup: 'Create account'
    }
  ];
});


<body ng-app="access">
    <section ng-controller="access">

        <div class="flex align-c justify-c links txt body lgt spac1" data-trans="ade">
            <a href="">{{links.logon}}</a>
            <a href="">{{links.setup}}</a>
       </div>

</section>
</body>

1 个答案:

答案 0 :(得分:1)

如果要访问第一个对象,请使用索引访问它,

 <div class="flex align-c justify-c links txt body lgt spac1" data-trans="ade">
            <a href="">{{links[0].logon}}</a>
            <a href="">{{links[0].setup}}</a>
 </div>

如果元素多于1个,请使用ng-repeat。

var app = angular.module('ops', [])

app.controller('access', function($scope) {
    $scope.links = [
    {
      logon: 'Logon',
      setup: 'Create account'
    }
  ];
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<body ng-app="ops">
    <section ng-controller="access">
        <div class="flex align-c justify-c links txt body lgt spac1"
             ng-repeat="data in links" data-trans="ade">
            <a href="">{{data.logon}}</a>
            <a href="">{{data.setup}}</a>
       </div>

</section>
</body>