Question

我的应用程序中使用了父视图：

$stateProvider
    .state("app", {
        abstract: true,
        url: "/app",
        templateUrl: "app/layout/menu-layout.html",
        controller: "MenuLayoutController as vm"
    })

它包含主要内容的ion-nav-view和侧边菜单：

<ion-side-menus enable-menu-with-back-views="false">
    <ion-side-menu-content>
        <ion-nav-view name="maincontent">
        </ion-nav-view>
    </ion-side-menu-content>
    <ion-side-menu side="left"">
        <ion-content>
            <div class="list">
                <!-- static menu items here -->
                <!-- and I want to add menu items here relevant 
                     to the child view-->
            </div>
        </ion-content>
    </ion-side-menu>
</ion-side-menus>

我也有儿童观点：

.state("app.questionnaire", {
    url: "/questionnaire/:id",
    views: {
        "maincontent": {
            templateUrl: "app/questionnaire/questionnaire.html",
            controller: "QuestionnaireController as vm"
        }
    }
})

我现在想在查看子视图时将菜单项添加到主菜单 - 但项目是动态的。在我的问卷控制器中，我有这一行来检索这些部分并将它们添加到该控制器模型中：

vm.sections = $filter('orderBy')(questionnaire.Sections, 'SortOrder');

我想在侧面菜单中添加每个部分的链接。有一个简洁的方法吗？也许使用angular-ui-router并在菜单中添加另一个ion-nav-view？

Answer 1

最后我在父控制器中执行了此操作：

function MenuLayoutController() {
    var vm = this;

    vm.reset = function () {
        vm.items = [];
    };

    vm.showMenu = function (questionnaire){
       vm.items = questionnaire.menuItems;
    }

    vm.reset();
}

这在我的孩子控制器中：

function QuestionnaireController($scope, /*etc*/){
   var vm = this;
   vm.menuItems = //fetch menu items

   //use scope to get a handle on the parent view model
   var parentmodel = $scope.$parent.vm;
   parentmodel.showMenu(vm);

    //reset the parent view when this controller is destroyed to remove the menu
    $scope.$on("$destroy", function () {
        parentmodel.reset();
    });
}

如何将子项视图中的其他项放入侧边菜单

1 个答案: