Webdesigner Webdesigner - 6 months ago 22
Node.js Question

how should I create the path of templateUrl property in Angular ui-router?

Please, help!

I'm trying to figure out why the chrome console returns me that it can't find my "home.html" template

GET http://localhost:3000/home.html 404 (Not Found)
.
I'm afraid that I'm not setting correct the path of "templateUrl" property.

Here is my folder structure:

app.js
bin/
node_modules/
package.json
public/
---------javascript/
-------------------angularApp.js
routes/
views/
----------index.ejs
----------home.html


and this is my config code(located in angularApp.js)

angular.module('supervisor', ['ui.router'])
.config([
'$stateProvider',
'$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home', {
url: '/home',
templateUrl: '/home".html',
controller: 'MainCtrl'
});

$urlRouterProvider.otherwise('/home');
}
])


I also tried different paths like "../../home.html" but with no success. If I use inline template it's working(
<script type="text/ng-template" id="/home.html">Hello!</script>
).

Thank you!

Answer

It would appear you're using express to serve your application. Express is a server side framework, while angular is a client side framework. You shouldn't mix the 2 code bases. Everything you use in angular should be served as static resources. You're very likely serving your public folder as static routes. So most likely you need to modify your structure like so (how I would structure it):

public
--app
----scripts
------angularApp.js
----views
------home.html

Then your template url should be '/app/views/home.html'