javascript - 特定网址的 Angular 路由

标签 javascript angularjs routes

我目前正在从事一个 MEAN 堆栈项目,并试图获取一个特定的模板以显示在特定的 url 上。

目前,如果用户转到 www.myurl/catalog,它会加载 catalog.html 模板,就像使用任何/catalog?catagory=productType url 一样。

我希望它能在用户访问/catalog?category=specificProductType 时加载 catalogSpecific.html 模板。目前,catalog.html 模板取代了catalogSpecific.html 模板。我找不到关于这个特定问题的太多信息,因此我们将不胜感激。

目前我的路线是这样的:

app/front/app.js

angular.module('app', ['ngRoute',
                    'app.LandingModule.controller',
                    'app.CatalogModule.controller',
                    'app.ProductModule.controller',
                    'app.HeaderModule.directives',
                    'app.FooterModule.directives'
                    ])


.config(['$routeProvider', function($routeProvider) {
  $routeProvider
.when('/', {
  templateUrl: 'html/landing.html',
  controller: 'LandingController'
})
.when('/catalog', {
  templateUrl: 'html/catalog.html',
  controller: 'CatalogController'
})
.when('/catalog?category=specificProductType', {
  templateUrl: 'html/catalogSpecific.html',
  controller: 'CatalogController'
})
.otherwise({
  redirectTo: '/'
});
}]);

最佳答案

编辑:似乎我错了,默认路由器不可能做到这一点。正如 Hadi 在他们的评论中所描述的,您可以将“templateUrl”替换为一个函数,该函数返回给定当前路由的模板 url。


据我所知,您无法使用内置的 Angular 路由器按照您想要的方式进行路由。

据我所知,您有两种选择:

1:学习使用 ui-router 库(可在此处找到:https://github.com/angular-ui/ui-router)

2:将所有路由从/catolog 发送到 Controller /页面,该 Controller /页面手动查看您的路由参数并根据该手动重新路由。 (参见 https://docs.angularjs.org/api/ngRoute/service/ $routeParams)

关于javascript - 特定网址的 Angular 路由,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44292683/

相关文章:

javascript - Leaflet、JS、示例代码不渲染 map

javascript - 这个函数什么时候获取这个参数?

javascript - 如何自动将相对导入路径重写为绝对路径?

c# - WebAPI 路由不起作用

javascript - Bootstrap3.js 和 Wordpress jQuery v1.10.2 不能正常工作

javascript - 使用 AngularJS 自定义 HTML5 视频播放器控件

angularjs - Angularjs 指令隔离范围不起作用

javascript - TypeScript 和 SystemJS : angular ui router module not registered in transpiled js

c# - 在 ASP.NET MVC 3 中为 Controller 设置默认操作(而不是索引)

javascript - 在 UI 路由器 angularjs ionic 上运行函数