[英]Accessing the 'id' value from the side menu example from the Iconic framework using AngularJS and
With the Iconic Framework side menu example how do I access the 'id' and 'Title' value from the controller? 使用Iconic Framework侧面菜单示例,如何从控制器访问“id”和“Title”值?
.controller('PlaylistsCtrl', function($scope) {$scope.playlists = [
{ title: 'Traffic', id: 1 },
{ title: 'Litter', id: 2 },
{ title: 'Marine', id: 3 }]
In the Playlist.html template file? 在Playlist.html模板文件中?
<ion-view view-title="Playlist One">
<ion-content>
<h1>Playlist</h1>
</ion-content>
</ion-view>
The other relevant code from app.js file is: app.js文件中的其他相关代码是:
.state('app.single', {
url: "/playlists/:playlistId",
views: {
'menuContent': {
templateUrl: "templates/playlist.html",
controller: 'PlaylistCtrl'
}
}
})
And the controller - I think: 控制器 - 我想:
.controller('PlaylistCtrl', function($scope) {
})
You should bind PlaylistsCtrl
to this ion-view
from its state
mentioned in config
phase. 您应该将
PlaylistsCtrl
从config
阶段中提到的state
绑定到此ion-view
。
<ion-view view-title="Playlist One">
<ion-content>
<h1>Playlist</h1>
<div ng-repeat="playlist in playlists">
Number: {{playlist.id}} | Title: {{playlist.title}}
</div>
</ion-content>
</ion-view>
Old Ans
老安斯
Its Simple. 这很简单。 you just have to insure that in your Config you have assigned controller to the view.
你必须确保在你的Config中你已经为视图分配了控制器。
<ion-view view-title="Playlist One">
<ion-content>
<h1>Playlist</h1>
<ul>
<li ng-repeat="p in playlists">
ID: {{p.id}}
</li>
</ul>
</ion-content>
</ion-view>
Updated 更新
<ion-view view-title="Playlist One">
<ion-content>
<h1>Playlist</h1>
<!-- Pass playlist as a parameter named **p** here onclick function-->
<ul>
<li ng-repeat="p in playlists" ng-click="selected(p)">
ID: {{p.id}}
</li>
</ul>
</ion-content>
</ion-view>
Your controller will look like this.Only you need to add selected function in your controller like this. 您的控制器将如下所示。您只需要在控制器中添加所选功能。
.controller('PlaylistCtrl', function($scope) {
$scope.selected=function(playlist){
$scope.selectedPlaylist=playlist;
console.log($scope.selectedPlaylist.id)
}
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.