Question

我的应用程序有许多属于不同类别的状态，我需要为每个类别提供不同的侧边菜单。

/book/view
/book/edit
..
/dvd/buy
/dvd/view
..etc

我有3个选项：

1。使用不同的菜单模板：

    $stateProvider                                     
        .state('dvd', {                                    
            url: '/dvd',                                   
            abstract: true,                                
            templateUrl: 'templates/dvd_menu.html',            
            controller: 'AppCtrl'                          
        })                                                 

         .state('book', {                                    
            url: '/book',                                   
            abstract: true,                                
            templateUrl: 'templates/book_menu.html',  
            controller: 'AppCtrl'                          
        })

使用此功能，我无法确定是否启用后退按钮以显示您是否从书籍切换到DVD。

2。动态填充菜单：

    <ion-item 
             menu-close
             ng-click="$eval(item.click)"
             ng-repeat="item in customMenuItems track by $index">
        {{item.text}}
    </ion-item>

建议使用此解决方案吗？

第3。将所有项目放入菜单中，然后使用ng-show打开和关闭它们。

我有什么更好的解决方案，你会怎么做？

Answer 1

这取决于您的选择。

对我来说，创建一个可以将actionId和app.js作为参数的控制器。

在$stateProvider .state('category', { url: '/category/:categoryId/:actionId', templateUrl: 'templates/category.html', controller: 'CategoryCtrl' })注册：
```
CategoryService
```
创建getItems来处理每个类别的项目，例如我有一个categoryId方法，该方法需要actionId和CategoryCtrl并返回列表项目。然后将其注入myApp.controller('CategoryCtrl', ['$scope', '$stateParams', 'CategoryService', function($scope, $stateParams, CategoryService){ var categoryId = $stateParams.categoryId; var actionId = $stateParams.actionId; $scope.customMenuItems = CategoryService.getItems(categoryId, actionId); });：
```
customMenuItems
```
通过$ scope将templates/category.html绑定到a视图。

推荐动态离子侧菜单设计

1 个答案: