javascript - 如何在 AngularJS 中用另一个 subview 替换 subview

Question

我有一个用 AngularJS 编写的 SPA。主页使用 ng-include 属性来确定要加载哪个 View 。当有人单击主页中包含的菜单时，这是在 JavaScript 中设置的。但是，我遇到过一种情况，我需要通过单击另一个 View 中的按钮来加载不同的 View ，本质上是替换它。

我试图找出如何做到这一点，根据我的研究，我必须使用 $rootScope 以及 subview 中的 $emit 或 $broadcast 调用以及 $rootScope.$on 方法检测此事件。

问题是，这似乎不起作用。我已经设置了断点并单步执行代码，但我总是收到此错误:

错误:[ngModel:datefmt] http://errors.angularjs.org/1.5.7/ngModel/datefmt?p0=2009-07-21T00%3A00%3A00

这是我的父页面 Controller 中的代码:

$rootScope.$on('viewChanged', function () {
    var menuItem = {
        template: 'customerOrders.html' // will be eventually dynamic
    };

    navigate(menuItem);
});

function navigate(menuItem) {
    $scope.activeMenuItem = menuItem;
}

<div data-ng-include="activeMenuItem.template"></div>

在子页面 Controller 中:

function changeSelectedView(viewTemplate) {
    $rootScope.$emit('selectedViewChanged', viewTemplate);
}

显然我在这里做错了什么。我如何完成我想要的事情，或者是否有完全不同的方法来做到这一点？

Answer 1

您可以使用ng-route在 View 之间工作。检查https://docs.angularjs.org/api/ngRoute/provider/ $routeProvider