时间戳

首页 > 解决方案 > 在 Angular 中使用嵌套的 JSON 数据

json - 在 Angular 中使用嵌套的 JSON 数据

问题描述

非常新的角度和只是试验。

我正在尝试使用嵌套的 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>

标签： jsonangularjsnested

解决方案

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

 <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>

推荐阅读