问题描述
我希望侧面菜单带有章节列表，例如：chap1，chap2..chap10。 如果单击chap1，如何更改内容，该内容将显示chap1的内容？ 内容是从JSON文件中检索的。
//路线
.state('chapter', {
url: '/chapter/:aId',
templateUrl: 'templates/chapters.html',
controller: 'ChapterController'
})
//控制器
.controller('ChapterController', function($scope, $stateParams, $http, $ionicSlideBoxDelegate, $ionicSideMenuDelegate){
$http.get('js/bb.json').success(function(data){
$scope.chapters = data.bb;
$scope.imagesArray = [];
data.bb.forEach(function (item) {
if(item.chapter == $stateParams.aId){
item.images.forEach(function (image) {
$scope.imagesArray.push({
src: image
});
});
}
});
$ionicSlideBoxDelegate.$getByHandle('image-viewer').update();
$scope.reloadChap = function(){
$scope.imagesArray = [];
data.bible.forEach(function (item) {
// console.log($stateParams);
if(item.chapter == $stateParams.aId){
item.images.forEach(function (image) {
$scope.imagesArray.push({
src: image
});
});
}
});
}
});
})
我的问题是，当我单击chap2时，内容不会更改为chap2的内容，但是上面的url已更改为“ / chapter / 2”。
数百万的感谢。
1楼
Jess Patton
0
2015-07-30 16:29:35
所以说你的json看起来像这样
$scope.chapters = [{chapter 1: 'text', number: '1'}, {chapter 2: 'text', number: '2'}];
在侧面菜单中，您要显示所有可以单击的章节
<ion-side-menu side="right" ng-click="showChapterContent($index)">
<div class="item" ng-repeat="chapter in chapters">
{{chapter.number}}
</div>
</ion-side-menu>
请参见ng-click函数，该函数将传递您单击的任何章节的索引。 这样您便拥有了侧面菜单的内容。
<ion-side-menu-content>
{{chapterContent}}
</ion-side-menu-content>
并在您的控制器中
$scope.showChapterContent = function(index){
$scope.chapterContent = $scope.chapters[index].chapter;
};
然后，当您单击侧面菜单中的章节时，它将从json文件中获取适当的文本，并将其显示在页面的中间内容中。