Question

在转换现有的角度站点时，我遇到了一个恼人的问题。最初的症状是某个控制器在登录后没有立即运行它的初始化功能。我记录并跟踪，最终我意识到这是页面的设计缺陷。从本质上讲，index.html包含<header>，<ng-view>和<footer>。登录后我想要评估的标题中有一些ng-if属性，但由于视图是唯一重新加载的属性，因此它不会重新初始化标头控制器，因此不会更新ng-if值。

然后我想起了ngInclude，这似乎是一个完美的解决方案，直到我把它连接起来并意识到它也不起作用。它首次加载模板，并且在视图更改时不会重新初始化。因此，我明白了将HeaderController传递给另一个控制器或服务，并通过各种代理控制这个顽固的布尔值。这也行不通。然后我尝试将一个函数和一个布尔值放到另一个服务中，并在头控制器中镜像该属性，但到目前为止我还没有完成这个工作。

我已经对索引中的多个视图进行了大量研究，到目前为止我听到了很多关于这个ui-router的信息，但我仍然不相信这是我想要的方式。它似乎不是一个简单的解决方案。我还没有尝试过把ng-include放到模板中，因为那时我觉得这样我们每次更改菜单时都要更新100页。

我失去了一整天。如果有人能告诉我如何在我的标题控制器中触发对这个属性的评估，我想在其他模板之外生活，请告诉我！

Answer 1

好的，所以当视图重新加载时，您需要知道HeaderController。有很多方法可以做到这一点，但在这种特殊情况下，更容易也许更正确的是事件。

因此，当您刷新视图时，请执行此操作，假设您需要ob1和ob2个变量的新值。

// ViewController
$rootScope.$emit('viewRefresh', {ob1: 'newvalue1', ob2: 'newvalue2'});

在您的HeaderController中，您需要倾听该事件，并在您的$ scope上设置这些attrs的新值（如果您不使用controller as语法）。

// HeaderController
$rootScope.$on('viewRefresh', function onRefresh(event, data) {
    $scope.ob1 = data.ob1;
    $scope.ob2 = data.ob2;
})

另一种解决方案 通过服务分享承诺（使用$q）

function HeaderService($q) {
    var defer = $q.defer();
    return {
        getPromise: function() {return defer.promise},
        notify: function(data) {defer.notify(data)}
    }
}

function HeaderController(HeaderService) {
    var vm = this;
    HeaderService.getPromise().then(function(data) {
        vm.ob1 = data.ob1;
        vm.ob2 = data.ob2;
    })
}


function ViewController(HeaderService) {
    var data =  {ob1: 'newvalue1', ob2: 'newvalue2'};
    HeaderService.notify(data)
}

angularjs中的动态标题/菜单

1 个答案: