无论我采取什么样的方法,除了帆的路线之外的每一次溃败都会返回404.
我已经尝试了1.2和1.3 Angular版本,我正在使用Sails v 0.9.15.
所有脚本都以正确的顺序加载(例如)：
<script src="/linker/js/libs/angular/angular.js"></script> <script src="/linker/js/libs/angular/angular-resource.js"></script> <script src="/linker/js/libs/angular/angular-route.js"></script> <script src="/linker/js/libs/angular/angular-sanitize.js"></script> ... <script src="/linker/js/app.js"></script>
我正确使用ngRoute：
var myApp = angular.module(‘myApp’,[‘ngRoute’]);
这是我在Angular的app.js中的路线：
myApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/profile',
{ templateUrl: 'linker/views/profile.html', controller: 'MainCtrl' })
.when('/profile-detail',
{ templateUrl: 'linker/views/profile_detail.html', controller: 'MainCtrl' });
}]);
我也在使用位置提供商：
myApp.config(function ($locationProvider) {
$locationProvider.html5Mode(true);
});
额外细节：
ng-app和ng-view被正确放置,我的路径是正确的.我可以使用Angular正确显示profile.html(并且还包括来自Sails的Restful API的数据).
问题是,我只能对Sails的routes.js中定义的路由执行此操作.
例：
module.exports.routes = {
'/' : {
controller: 'main',
action: 'index'
},
'/signup' : {
controller: 'main',
action: 'signup'
},
'/login' : {
controller: 'main',
action: 'login'
},
'/profile': {
controller: 'users',
action: 'profile'
} //......
所以基本上,为了用Angular显示一些html内容,我必须在Sails的配置中完全定义相同的路由,这没有任何意义.
有任何想法吗？附：如果需要,我会提供额外的数据.
尝试删除html5模式,看看会发生什么：$locationProvider.html5Mode(false);
如果您仅使用sails应用程序为Angular应用程序提供API,但是您使用相同的后端来提供角度代码,那么您可以在所有API路径前加上’api’,以防止与角度路径发生冲突.
而不是/ profile你会有/ api / profile
编辑：
我已经看了一下Sails.js框架并制作了一个小应用程序来测试它.
我能够成功地在角度工作中获得未被帆定义的路线.
我认为对角度路由的工作方式存在误解.
如果使用window.location更改路径或手动键入URL,浏览器将向服务器发送get请求.因此,在您的情况下,将会有/ profile或/ profilee的请求,服务器将查看可用的路由,如果没有匹配则将抛出404.
为了防止这种情况,您应该使用angular方法实际更改路径. Angular在路径中使用“#”符号来阻止浏览器在URL更改时向服务器发送请求.浏览器忽略’#’符号后的更改.或者在您的情况下,使用html5模式可以实现类似的效果.请注意,当用户刷新页面时,使用html5模式会导致麻烦,从那时起将向服务器发出请求(更多关于如何修复下面的内容).
那么,你应该使用javascript更改路径的是$location服务.在你的角度视图中,你也可以使用普通的锚标签,因为angular会解析那些：
<a href="/profilee">Go to profile</a>
由于您拥有的是单页面应用程序,因此所有视图都由客户端处理.超出根(/)的所有路径都是由angular创建的虚拟路径.它们通常不存在于服务器中.只有root可用.当使用can be a problem的html5模式时.
解决这个问题的一种方法是重写服务器的路由以提供其他所有内容,就好像它是对根路径的请求一样.在sails中,他们甚至建议如何在config / routes.js中执行此操作：
// What about the ever-popular "vanity URLs" aka URL slugs? // (you might remember doing this with `mod_rewrite` in Apache) // // This is where you want to set up root-relative dynamic routes like: // http://yourwebsite.com/twinkletoez // // NOTE: // You'll still want to allow requests through to the static assets, // so we need to set up this route to ignore URLs that have a trailing ".": // (e.g. your javascript, CSS, and image files) 'get /*(^.*)': 'UserController.profile'
关于sail中的API,您可以在config / controllers.js文件中配置前缀：
/** * `prefix` * * An optional mount path for all blueprint routes on a controller, including `rest`, * `actions`, and `shortcuts`. This allows you to continue to use blueprints, even if you * need to namespace your API methods. * * For example, `prefix: '/api/v2'` would make the following REST blueprint routes * for a FooController: * * `GET /api/v2/foo/:id?` * `POST /api/v2/foo` * `PUT /api/v2/foo/:id` * `DELETE /api/v2/foo/:id` * * By default, no prefix is used. */ prefix: '',