Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Do angular views work when a site is served from the local file system?

I'm using angular to develop an application. I'm developing off my local file system, on Windows. However, when I enable angular-route.js, whenever I hit index.html with my browser, it instead goes to index.html#/C:/.

My route definition is:

myApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/', {templateUrl: 'home.html', controller: 'HomeCtrl'});
}

I think this causes the site to break, because /C:/ doesn't match any angular routes. What's going wrong? How do I fix this?

like image 566
Chris B. Avatar asked Oct 21 '13 19:10

Chris B.


People also ask

Does Angular run on server or client?

Angular Universal executes on the server, generating static application pages that later get bootstrapped on the client. This means that the application generally renders more quickly, giving users a chance to view the application layout before it becomes fully interactive.

How does Angular application run within an HTML page?

How AngularJS Integrates with HTML. The ng-app directive indicates the start of AngularJS application. The ng-model directive creates a model variable named name, which can be used with the HTML page and within the div having ng-app directive.

What are views in Angular?

Views are almost like their own virtual DOM. Each view contains a reference to a corresponding section of the DOM. Inside a view are nodes that mirror what is in the this section. Angular assigns one view node per DOM element. Each node holds a reference to a matching element.

In which folder are the most important files stored in AngularJS?

top-level “app” folder : all angular files should be placed within a folder that could be named as “app”. “app” is the top-level folder. app/components folder: one or more components can be placed within “app/components” folder.


1 Answers

For routing & ajax (& more) to work properly, run a local development server; avoid use of file:// for development, since browsers have different rules for it.

Tools like yeoman + generator-angular will automatically set up a gruntfile with a server task, which will run a node-connect server to locally serve your files.

You can do this with

  • python: (3)python -m http.server 8001 (replace http.server with SimpleHttpServer in 2)
  • node.js + connect
  • ruby + rack
  • From the angularjs tutorial (number 5 under "working with the code") - "You need an http server running on your system, but if you don't already have one already installed, you can use node to run scripts\web-server.js, a simple bundled http server."

Response from comments: For phonegap, use the phonegap tools. It does exactly what I said, it runs a local server.

like image 121
forivall Avatar answered Sep 28 '22 06:09

forivall