Couldn't load template using templateUrl in Angularjs

Question

I am just learning Angularjs, and how to use templateUrl to load a template.

I have a simple directive:

var mainApp = angular.module(\"mainApp\", [])         


        

Answer 1

The problem is that you are running your example off the file system (using the file:// protocol) and many browsers (Chrome, Opera) restricts XHR calls when using the file:// protocol. AngularJS templates are downloaded via XHR and this, combined with the usage of the file:// protocol results in the error you are getting.

You've got several options when it comes to resolving this situation:

• Run your examples using a web server (there are many easy solutions like https://code.google.com/p/mongoose/ or a few lines node.js script)
• Embed templates in your index.html file using the