javascript - AngularJS $routeProvider 路由按页面不同？

Question

我的构建过程连接了所有JS，所以在没有任何黑客攻击的情况下，有没有办法指定$routerProvider只能在单个页面上使用，或者覆盖$routeProvider code> 以页面适当的路线进行响应？

我有这个:

/app/page1#/many-things-go-here

和/app/page2#/many-things-go-here

我希望这些路由的处理是分开的。我该怎么做？

Answer 1

编辑--原始答案如下最简单的方法是向每个页面添加一个脚本 block 来定义一个模块常量，然后在配置 RouteProvider 的配置部分中检查该常量。

示例:

// page1.html
angular.module('app').constant('SHOULD_USE_ROUTE_PROVIDER', false);

// page2.html
angular.module('app').constant('SHOULD_USE_ROUTE_PROVIDER', true);

// module config section
angular.module('app').config(function(..., SHOULD_USE_ROUTE_PROVIDER) {
   ...
   if (SHOULD_USE_ROUTE_PROVIDER) {
      // configure it here
   }
   ...
});

原答案:

Angular 方法是添加一个提供程序( https://docs.angularjs.org/guide/providers )，它允许您配置一个标志来确定是否应该使用 routerProvider...假设您使用 shouldUseRouterProvider 属性创建一个 RoutingProvider ，然后在您的路由文件中具有 routerProvider 特定逻辑，您可以注入(inject)提供程序并检查:

// inject RouterProvider

if (RouterProvider.shouldUseRouterProvider) {
    ... routerProvider configuration
}

如果您使用此方法，则在您的页面中，只需添加一个带有 module.config 部分的脚本 block ，该部分设置该页面的配置，如下所示:

angular.module('app').config(['RouterProvider', function(RouterProvider) {
    RouterProvider.shouldUseRouterProvider = false;
}]);

<小时/>

最简单的方法是在每个页面的脚本 block 中设置一个全局变量，并在设置 routerProvider 的 Angular 相关代码中检查它。