Question

基本上，如何从Angular应用程序中检测特定路由是否已链接到，或者从配置阶段内将该URL输入地址栏的用户直接访问？

我知道我可以听取以下$locationChangeSuccess事件：

$Scope.$on('$locationChangeSuccess', function(evt, newUrl, oldUrl) {
    // -- do something with oldUrl --
});

在$Scope或$rootScope上，但这些实例在配置阶段不可用。

也许我说这比它需要的更复杂，但任何帮助都会非常感激。

更新

给出一些背景信息。我的应用程序中的一些路由将关联的模板加载到模态窗口而不是标准视图中。我正在使用ui-router以下基本配置：

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {
$stateProvider.state('index', {
  url: '/',
  templateUrl: 'index.html'
});
$stateProvider.state('foo', {
  url: '/foo',
  views: {
    '': {
      template: '='
    },
    modal: {
      templateUrl: 'modal.html'
    }
  }
});

} ]）;

主要模板：

<div class="main" ui-view></div>
<div ui-view="modal"></div>

如果用户通过链接（/foo）访问ui-sref="foo"，这样可以正常工作，但我遇到的问题是如果将/foo路由直接输入地址栏中的基础模板显然不存在。如果以这种方式访问页面，我可以手动设置它。因此，如果我可以告诉请求来自哪里，那么我可以相应地设置模板，但需要在上面的配置阶段完成（至少我认为是这样）。

请注意，如果我明确设置了模板，则会在每次/foo请求时重新加载，这不是所需的结果。

Answer 1

我可以提出一个解决方案，但我不确定它在您的应用环境中是否有意义。

您可以将foo路由作为索引路由的子路由：

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {
    $stateProvider.state('index', {
        url: '/',
        templateUrl: 'index.html'
    });
    $stateProvider.state('index.foo', {
        url: '/foo',
        views: {
            'modal@': {
                templateUrl: 'modal.html'
            }
        }
    });
});

<div ui-view></div>
<div ui-view="modal"></div>

此方法的“缺点”是，如果您需要在应用程序的任何其他部分重用模态，则需要为每个需要它们的顶级状态重新定义状态声明。

如果你找到了更好的解决方案，请点击这个答案，因为我正试图解决一个非常类似的问题。

AngularJS路由：检测路由/状态是否链接到或直接输入为url

更新

1 个答案: