如何使用ng-repeat显示单个对象数据?

时间:2016-03-03 18:10:46

标签: angularjs

目标: - 仅显示单个对象数据。 我是否必须使用ng-repeat来获取对象?

我对角度相对较新。有更好的方法吗?

Html查看: -

<div ng-controller="dashboardController">
    <div ng-repeat="person in persons">
        <span class="name">{{person.name}}</span>
        <span class="title">{{person.title}}</span>
    </div>
</div>

控制器代码: -

.controller('dashboardController', ['$scope', function(scope){
    scope.persons = [
      {
        name:"George Harrison",
        title:"Goof Off extraordinaire"
      }
    ];
}])

更新我的下载,数组与单数据集:

scope.persons = [ <-- that creates an array. Cant believe I forgot that.
scope.persons = { <-- that creates a single data set

3 个答案:

答案 0 :(得分:4)

scope.persons是一个数组,所以你必须使用ng-repeat。 如果您的数据是对象,则不需要使用ng-repeat。 例如: 你的控制器

    .controller('dashboardController', ['$scope', function(scope){
    scope.person ={
        name:"George Harrison",
        title:"Goof Off extraordinaire"
      }

}]);

所以你的HTML:

<div ng-controller="dashboardController">
<div>
    <span class="name">{{person.name}}</span>
    <span class="title">{{person.title}}</span>
</div>

答案 1 :(得分:3)

这可以通过当前的Json结构为您的事业服务:

 <div ng-controller="dashboardController">
        <div>
            <span class="name"> {{persons[0].name}} </span>
            <span class="title"> {{persons[0].title}} </span>
        </div>
    </div>

答案 2 :(得分:1)

通常情况下,如果你只获得一个项目,它将是一个对象

$scope.beatle = {
     name:"George Harrison",
     title:"Goof Off extraordinaire"
}

然后直接在视图中引用

{{beatle.name}}