¿Por qué mi vista de AngularJS no se carga en Cordova?

Mi index.html es:

 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> <title>Hello World</title> </head> <body ng-app="app"> THIS WORKS NOW! <div ng-view></div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/angular.min.js"></script> <script type="text/javascript" src="js/angular-route.min.js"></script> <script type="text/javascript" src="js/app.js"></script> </body> </html> 

Y en app.js , tengo:

 var app = angular.module('app', ['ngRoute']); app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $routeProvider.when('/', { templateUrl: 'templates/home.html' }).when('/dashboard', { templateUrl: '/templates/dashboard.html' }).otherwise({ networkingirectTo: '/' }); $locationProvider.html5Mode(true); } ]); 

Así que cordova build ios y es mágico hacer un proyecto xcode, que luego abro y ejecuto. ¡Veo THIS WORKS NOW! , pero no veo el contenido de mi file home.html .

¿Qué estoy haciendo mal?

Necesitas bootstrap angular:

app.js está bien!

pero elimine ng-app dentro de la label <body> y comience angular cuando el evento onDeviceReady se haya activado:

file index.js :

 var app = { initialize: function () { this.bindEvents(); }, bindEvents: function () { document.addEventListener("deviceready", this.onDeviceReady, false); }, onDeviceReady: function () { angular.element(document).ready(function () { angular.bootstrap(document, ["app"]); }); } }; 

normalmente eso es todo lo que necesitas hacer.