angularjs - How to give priority to angular routing instead of node routing while using html5Mode(true) in angular JS -
i want route application according angular routes in html5mode(true). here angular code snippet.
index.html
<!doctype html> <html lang="en"> <head> <title>myapp</title> <base href="/"> <!-- import angular --> <script type="text/javascript" src="bower_components/angular/angular.min.js"></script> <!-- import angular route --> <script type="text/javascript" src="bower_components/angular-route/angular-route.min.js"></script> <!-- import local js files --> <script type="text/javascript" src="app/app.routes.js"></script> <script type="text/javascript" src="app/usercontroller.js"></script> <script type="text/javascript" src="app/app.js"></script> </head> <body> <ng-view ng-app="myapp"></ng-view> </body> </html> app.js
var app = angular.module('myapp', ['approute']) app.routes.js
angular.module('approute', ['ngroute', 'usercontroller']) .config(function($routeprovider, $locationprovider) { $locationprovider.html5mode({ enabled: true }); $routeprovider .when('/user', { templateurl: 'app/user.html', controller: 'usercontroller', controlleras: 'user' }).otherwise({ redirectto: '/user' }); }); usercontroller.js
angular.module('usercontroller', []) .controller('usercontroller', function() { }); but when hit url i.e. http://0.0.0.0:3000 in browser, redirects url http://0.0.0.0:3000/user correct when try reload tells me cannot /user guess response node server. how can configure application browser uses http://0.0.0.0:3000 or http://0.0.0.0:3000/user.
update: nodejs server code.
// grab need var path = require('path'); var express = require('express'); var app = express(); // setup public folder app.use(express.static(path.join(__dirname, 'public'))); app.set('views', __dirname + 'public'); // set server var server = app.listen(3000, 'localhost', function() { console.log('server connected @ ' + this.address().address + ':' + this.address().port); }); // export exposed variable module.exports = app;
you need add catch-all rule routing in server code.
update code adding rule before setting-up server:
app.all('/*', function (req, res, next) { // send index.html other files support html5mode. assuming index.html @ application root res.sendfile('index.html', { root: __dirname }); }); this catch other requests (different root) , redirect them index.html in order support html5 mode.
essentially, server code should this:
// grab need var path = require('path'); var express = require('express'); var app = express(); // setup public folder app.use(express.static(path.join(__dirname, 'public'))); app.set('views', __dirname + 'public'); /* catch-all rule here */ app.all('/*', function (req, res, next) { // send index.html other files support html5mode res.sendfile('index.html', { root: __dirname }); }); // set server var server = app.listen(3000, 'localhost', function() { console.log('server connected @ ' + this.address().address + ':' + this.address().port); }); // export exposed variable module.exports = app; 
Comments
Post a Comment