Javascript 使用ng repeat访问变量中的对象
我想使用ng repeat从下面的变量访问对象属性的值,除了songs属性 毕加索={ 标题:'颜色', 艺术家:“巴勃罗·毕加索”, 标签:“立体主义”, 年份:“1881”, albumArtUrl:“资产/图像/相册封面/01.png”, 歌曲:[ {标题:'Blue',持续时间:'4:05',音频URL:'assets/music/Blue'}, {标题:“绿色”,持续时间:“5:05”,音频URL:“资产/音乐/绿色”}, {title:'Red',duration:'3:45',audioUrl:'assets/music/Red'}, {标题:'Pink',持续时间:'4:05',音频URL:'assets/music/Pink'}, {标题:'Magenta',持续时间:'4:03',音频URL:'assets/music/Magenta'} ] };代码> 下面是我的controller.js在我的album.js中的样子:Javascript 使用ng repeat访问变量中的对象,javascript,angularjs,Javascript,Angularjs,我想使用ng repeat从下面的变量访问对象属性的值,除了songs属性 毕加索={ 标题:'颜色', 艺术家:“巴勃罗·毕加索”, 标签:“立体主义”, 年份:“1881”, albumArtUrl:“资产/图像/相册封面/01.png”, 歌曲:[ {标题:'Blue',持续时间:'4:05',音频URL:'assets/music/Blue'}, {标题:“绿色”,持续时间:“5:05”,音频URL:“资产/音乐/绿色”}, {title:'Red',duration:'3:45',au
(function(){
function AlbumCtrl(){
this.albumData = albumPicasso;
}
angular
.module('blocJams')
.controller('AlbumCtrl', AlbumCtrl)
})();
下面是我的html,我试图使用ng repeat访问这些值,但它不起作用,我根本看不到任何输出
<div class="album-view-details column half" ng-repeat="x in album.albumData">
<h2 class="album-view-title">{{x.title}}</h2>
<h3 class="album-view-artist">{{x.artist}}</h3>
<h5 class="album-view-release-info">{{x.year}}</h5>
</div>
{{x.title}}
{{x.artist}}
{{x.year}
ngRepeat需要一个集合
:
ngRepeat指令对一个模板中的每个项目实例化一次模板
收集每个模板实例都有自己的作用域,其中
循环变量设置为当前集合项,并设置$index
指向项索引或键
您可以通过以下方式直接打印对象属性的值:albumPicasso
(标题、艺术家、标签、年份)
:
<h2 class="album-view-title">{{albumData.title}}</h2>
<h3 class="album-view-artist">{{albumData.artist}}</h3>
<h5 class="album-view-release-info">{{albumData.year}}</h5>
{{albumData.title}
{{albumData.artist}
{{albumData.year}
如果只有一个对象,则不需要重复ng
。您可以通过执行{{this.albumData.title}}
ng repeat
与数组一起使用来引用属性
另外,如果它是一个数组,在您的
ng repeat
中,我不确定album.albumData
中的单词album
来自何处,您可能需要使用this.albumData
也许如果你把你的对象转换成一个对象数组?