Angularjs ng-view does not work with External templateUrl

Question

I want to use an angular application that works fine in my own domain and embeds it in several other sites.

The application uses partials with the ng_view directive, so the only thing I need to do is to "enter" my application on one of my pages ...

<div ng-app="myapp" ng-view></div> 

My application looks like this ...

 angular.module('myapp', ['myapp.filters', 'myapp.services', 'myapp.directives', 'ui']). config(['$routeProvider', function($routeProvider) { $routeProvider.otherwise({templateUrl: 'partials/mainTemplate.html', controller: myController}); }]); 

this works great, but when I try to “enter” the application into another site, in addition to externalizing the script links, I modified the application to look like this ...

 angular.module('myapp', ['myapp.filters', 'myapp.services', 'myapp.directives', 'ui']). config(['$routeProvider', function($routeProvider) { $routeProvider.otherwise({templateUrl: ''http://mydomain.com/partials/mainTemplate.html', controller: myController}); }]); 

But this will not work ... no errors, nothing, it just does not display my application.

Any ideas? are external partial links allowed? ... is the browser more secure? Should I use a completely different approach?

Answer 1

I think you should enable CORS on mydomain.com in order to get an idea. And, as bUKaneer says, you should add mydomain.com to $ sceDelegateProvider.resourceUrlWhitelist