为什么 Angular 的 `$location.url` 在我的 Bootstrap 模式关闭后不工作？

Question

问题：

任何人都知道为什么在我下面的 cb.register 函数中，我的模态 window 关闭正常，但 $location.url('/dashboard') 不正确运行？

我没有收到任何控制台错误，页面也没有重定向。但是，console.log('TRANSITION DONE') 在模式 window 关闭后仍然在下面的代码中打印出来，所以我知道事件正在被识别：

代码：

app.controller('userController', ['$scope', 'userFactory', '$location', function($scope, userFactory, $location) {
    var cb = {
        register: function(createdUser) {
            // Closes Modal window:
            $('#myModal').modal('hide');
            // Runs after close with completed transition effects:
            $('#myModal').on('hidden.bs.modal', function (e) {
                console.log('TRANSITION DONE');
                $location.url('/dashboard');
            })
        },
    };

}]);

问题：

为什么 $location 服务嵌套在我的 .on() 函数中时无法正常运行？
我应该改用 angular-ui 吗？（在研究这个问题的解决方案之前我并不熟悉，而是通过首先使用 bootstrap3 构建所有视图并包括 JS 文件等来开始我的项目）。

我尝试过的：

我试过将 $location 参数与 e 一起传递到 .on() 的回调函数中，但这并没有带来真正的改变，而且函数应该仍然可以访问更大范围内的 $location。
控制台日志记录 $location 或 $location.url 工作正常，所以我知道这些方法在范围内是可访问的。
将 $location 函数移到 on() 函数之外确实会加载仪表板页面，但是淡出模式关闭不会完成。浅灰色透明 BG 覆盖了我的仪表板页面，这就是为什么我选择根据文档使用 hidden.bs.modal 事件：http://getbootstrap.com/javascript/#modals
```
// Closes window:
$('#myModal').modal('hide');
// Redirects to page but fade-out on Modal not completed:
$location.url('/dashboard');
```

想要Behavior/Pseudo-Code：

模态 window 关闭（当回调运行s 时）
模态淡出后：
- $location.url('/dashboard') 运行s，正在加载仪表板页面

感谢任何可以提供帮助的 angular/bootstrap 忍者！

Answer 1

为什么 $location 服务嵌套在我的 .on() 函数中时无法正常运行？

您在您的应用程序中直接使用 Bootstrap 模式 - 这没问题。但是，这个要求ui要求你用jQuery操作模态框。不建议在 AngularJS 应用程序中使用 jQuery，因为 AngularJS 有自己的 DOM 操作方法，因此您不应该手动操作 DOM通过 jQuery.

回答你的问题，因为你使用 jQuery 直接操作 DOM，很可能 AngularJS' 摘要周期没有在模式结束时开始.你可以通过告诉 AngularJS 通过 $scope.$apply() 激活摘要循环来解决这个问题。但是，这很容易弄脏您的代码，并且根据最佳 AngularJS 原则是没有意义的。

我应该改用 angular-ui 吗？（在研究这个问题的解决方案之前我并不熟悉，而是通过首先使用 bootstrap3 构建所有视图并包括 JS 文件等来开始我的项目）。

是的。我高度建议使用 angular-ui。根据文档：

This repository contains a set of native AngularJS directives based on Bootstrap's markup and CSS. As a result no dependency on jQuery or Bootstrap's JavaScript is required.

如您所见，所有 Bootstrap 功能都包含在 AngularJS 指令中，可以轻松将其放入您的应用程序中，而无需担心 jQuery。

为什么 Angular 的 `$location.url` 在我的 Bootstrap 模式关闭后不工作？

Why isn't Angular's `$location.url` working after my Bootstrap Modal close?

angularjs

twitter-bootstrap-3

mean-stack

问题：

代码：

问题：

我尝试过的：

想要Behavior/Pseudo-Code：