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

目标： - 仅显示单个对象数据。我是否必须使用ng-repeat来获取对象？如何使用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" 
     } 
    ]; 
}])

更新我的同胞菜鸟，阵VS单个数据集：

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

来源

2016-03-03 Acts7Seven

一般来说，如果你只有一个项目，这将是一个对象

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

然后引用直接鉴于

{{beatle.name}}

来源

2016-03-03 18:14:59 charlietfl

谢谢。所以我明白控制器是做什么的。但是你建议我不需要控制器。你能解释一下为什么你会或不会在这种情况下使用控制器？如果您要编辑数据，这是否会成为您需要控制器的原因？ – Acts7Seven

是的，你需要控制器。该视图始终取决于控制器中的数据模型。我只是说，当你期待只有一个项目时，它通常是一个对象而不是数组 – charlietfl

这与当前的JSON结构为你的事业：

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

来源

2016-03-03 18:15:42 Prasad

谢谢！这适用于带有组件的Angular 1.5。我唯一改变的是使用ng-controller。组件中不需要它。我用：{{$ ctrl.persons [0] .name}} – PPJN

@ PPJN你可以用任何一种方式......很高兴我工作了。快乐编码！ – Prasad

scope.persons是一个数组，所以你必须使用NG-重复。如果你的数据是一个对象，你不需要使用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>

来源

2016-03-03 18:19:14

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

回答

相关问题