javascript - 如何使 Angular ui-router 父状态在状态更改时始终执行 Controller 代码？

Question

假设我们在 $stateProvider 中定义了父子关系，如下所示:

    .state('myProfile', {
        url: "/my/profile",
        templateUrl: 'my/profile.html',
        controller: 'MyProfileController'
    }).state('myProfile.edit', {
        url: "/edit",
        templateUrl: 'my/profile.edit.html',
        controller: 'EditMyProfileController'
    });

这里的想法是，父 myProfile 状态是不可编辑的，但子 myProfile.edit 状态是编辑配置文件的实际形式。让我们忽略个人资料页面是否应该这样工作 - 我只是在玩弄东西和学习。

当用户提交表单时，我使用 $state 对象返回父页面:

$scope.save = function() {
    userResource.update($scope.user, function() {
        SessionService.refresh();

        $state.go('myProfile'); // also tried with reload: true as well
    });
}

用户保存配置文件数据后 - 并且它已正确保存 - 父 View 不会更新，除非我按 F5 并刷新浏览器。

我注意到的一件事是，如果我将子 myProfile.edit 状态设置为父级本身，而不是 myProfile 状态的子级，这个问题实际上会出现离开，一切都按预期运行(尽管布局看起来很糟糕)。

看来 UI Router 可能正在缓存父级的结果，而不怀疑模型中的情况已经发生变化并且需要重新运行 Controller ？

如何保持父子关系，同时仍让父 myProfile 页面始终执行其 Controller 以重新加载其数据？基本上，我希望每当使用 $state 或单击指向 myProfile 的链接时都会发生这种情况。我怎样才能做到这一点？

如果我不能按照我的要求去做，那么我知道我可以设置一堆子状态并让它们按预期工作......但是，如何为父级设置默认子状态？例如，假设我希望 myProfile.edit 成为 myProfile 的默认子状态 - 我该如何做到这一点？

谢谢!

Answer 1

要在从子状态导航到父状态时强制重新加载父状态，您可以使用以下两种方法。纯js或指令属性。

<a ui-sref="myProfile" ui-sref-opts="{ reload: true }">Back to My Profile</a>

或

$state.go('myProfile', null, { reload: true });