Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular and Express routing

I've been through many Angular-express seeds and kind of worked out how they work. The problem I am having is: 1). I would like to use ejs-locals for templating. 2). How to configure correctly the routing of the server-side and client-side. And also, when entering a URL such as /about, not to generate the error: cannot /get

angular app.js contains:

// angular stuff  $routeprovider.when('/', {  templateUrl: 'index',  controller: IndexCtrl }); $routeprovider.when('/about', {  templateUrl: 'partials/about',  controller: IndexCtrl }); 

express app,js contains:

app.get('/', routes.index); app.get('/about', routes.about); 

routes folder contains 'index.js':

exports.index = function(req, res){   res.render('index',{name:"Hello"}); };  exports.about = function (req, res) {   res.render('partials/about'); }; 

Views folder contains index.ejs:

<!--HTML head/navigation bar here--> <div ng-view></div> 

and inside views folder is a partials folder: (Views/partials/)

index.ejs:

 <h1>Index</h1> 

about.ejs:

<h1>About</h1> 
like image 296
ashley Avatar asked Dec 13 '12 13:12

ashley


People also ask

What is the difference between Angular and Express?

Differences would be AngularJS is a client-side framework and Express is server-side framework. Express can be used with any client-side framework and so can Angular be used with any server-side framework.

What is the Angular routing?

Routing in Angular allows the users to create a single-page application with multiple views and allows navigation between them. Users can switch between these views without losing the application state and properties. Approach: Create an Angular app that to be used.

What is Express routing?

Routing refers to determining how an application responds to a client request to a particular endpoint, which is a URI (or path) and a specific HTTP request method (GET, POST, and so on). Each route can have one or more handler functions, which are executed when the route is matched.


1 Answers

Add these routes to your express server

app.get('/partials/:filename', routes.partials); app.use(routes.index); 

Then in routes.js

exports.partials = function(req, res){   var filename = req.params.filename;   if(!filename) return;  // might want to change this   res.render("partials/" + filename ); };  exports.index = function(req, res){   res.render('index', {message:"Hello!!!"}); }; 

This will make sure that express returns rendered templates when making requests to partials/index and partials/about.

Here's a gist: https://gist.github.com/4277025

like image 169
jaime Avatar answered Oct 16 '22 04:10

jaime