【问题标题】:Clean URLs with AngularJS and modal dialog boxes使用 AngularJS 和模式对话框清理 URL
【发布时间】:2013-07-04 00:30:33
【问题描述】:

我正在使用 AngularJS + UI Bootstrap 提供的“模态”指令。模态对话框效果很好,但我有一个问题:URL 没有改变。

例如,我的 AngularJS 应用程序为“/people”设置了一个路由,它显示了一个人员列表。当用户点击一个人时,会出现一个模式对话框并显示详细信息。我试图弄清楚如何在不实际导致 $routeProvider 重新执行控制器的情况下修改 URL。

例如,我的路线中可能有这样的东西:

$routeProvider.
when('/people', {controller: PeopleCtrl, templateUrl: 'templates/people.html'}).
when('/people/:personId', {controller: PeopleCtrl, templateUrl: 'templates/people.html'}).

然后在我的 PeopleCtrl 中我可以做到:

if ($routeParams.personId) {
    $scope.editPerson({id: $routeParams.personId});
}

这基本上调用了我在行上用 ng-click 绑定的相同函数。这适用于允许我的应用程序响应 /people/123 之类的 URL,但我不知道如何让 URL 从 /people 跳转到 /people/123,然后作为模态返回 /people对话框打开和关闭。

显然,我可以调用 $location.path("/people") 但问题是 PeopleCtrl 被重新执行,我想避免这种情况,因为应该保留模态“背后”的状态。

换句话说:我正在寻找一种方法来更改 URL/位置,而不会检测到正常的 $routeProvider 更改。

谢谢!

【问题讨论】:

    标签: twitter-bootstrap angularjs modal-dialog angular-ui-bootstrap


    【解决方案1】:

    找到了another SO post,它完全符合我的要求:

    function MyCtrl($route, $scope) {
        var lastRoute = $route.current;
        $scope.$on('$locationChangeSuccess', function(event) {
            $route.current = lastRoute;
        });
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-05-26
      • 2014-07-28
      • 1970-01-01
      • 2020-07-03
      • 2011-07-01
      相关资源
      最近更新 更多