2016-08-08 11 views
2

私は角度とコルドバに夢中です。私はコードバアプリケーションを開発しています。コルドヴァの角度を見ることができません。

app.js:私は、次のコードを持っている

var myApp = angular.module('myApp', ['ngSanitize', 'ngAnimate', 'ngRoute']). 
config(function ($routeProvider) { 
    $routeProvider 
     .when('/home', { 
      templateUrl: '/home.html', 
      controller: 'homeController' 
     }) 
     .when('/login', { 
      templateUrl: '/login.html', 
      controller: 'loginController' 
     }) 
     .when('/register', { 
      templateUrl: '/register.html', 
      controller: 'registerController' 
     }) 
     .otherwise({ 
      redirectTo: '/home.html' 
     }) 
}) 
.run(['$rootScope', '$location', 'authProvider', function ($rootScope, $location, authProvider) { 
    $rootScope.$on('$routeChangeStart', function (event) { 
     if (!authProvider.isLoggedIn()) { 
      alert('login'); 
      $location.path('/login') 
     } 
    }); 
}]). 
factory('authProvider', function() { 
    var user; 
    return { 
     setUser: function (aUser) { 
      alert('set user'); 
      user = aUser; 
     }, 
     isLoggedIn: function() { 
      alert('is loged in'); 
      return (user) ? true : false; 
     } 
    }; 
}); 

をそして、私のindex.jsは以下の通りです:

var app = { 
initialize: function() { 
    this.bindEvents(); 
}, 

bindEvents: function() { 
    document.addEventListener('deviceready', this.onDeviceReady, false); 
}, 
onDeviceReady: function() { 
    app.receivedEvent('deviceready'); 

    angular.bootstrap(document, ['myApp']); 
}, 
receivedEvent: function (id) { 
    console.log('Received Event: ' + id); 
} 
}; 
app.initialize(); 

そして、私のindex.htmlは以下の通りです:

<!DOCTYPE html> 
<html> 

<head> 
<meta charset="UTF-8"> 
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *"> 
<meta name="format-detection" content="telephone=no"> 
<meta name="msapplication-tap-highlight" content="no"> 
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 

<!--Shared Scripts--> 
<script type="text/javascript" src="js/shared/jquery.min.js"></script> 

<script type="text/javascript" src="js/shared/angular.js"></script> 
<script type="text/javascript" src="js/shared/angular-route.min.js"></script> 
<script type="text/javascript" src="js/shared/angular-animate.min.js"></script> 
<script type="text/javascript" src="js/shared/angular-sanitize.min.js"></script> 

<!--Custom Scripts--> 
<script type="text/javascript" src="js/index.js"></script> 
<script type="text/javascript" src="js/app.js"></script> 
<script type="text/javascript" src="js/homeController.js"></script> 
<script type="text/javascript" src="js/loginController.js"></script> 

<title></title> 
</head> 

<body> 
<div ng-view></div> 
<script type="text/javascript" src="cordova.js"></script> 
</body> 

</html> 

ブラウザでアプリをエミュレートすると(cordova emulate browser)、すべてのことはOKで、ng-viewはうまく動作しますが、実行するとそれはアンドロイドデバイス(cordova run android)、ng-viewで動作しません!

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/); 
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/); 
私app.jsに

、ない成功を:

私はまた、追加しようとしています!私はまた、次のように私のhtmlbodyを定義しようとしている:

<html ng-app='myApp'> 

または

<body ng-app='myApp'> 

しかし、誰の成功を!

私はAngularJs 1.5.8を使用し、コルドバ6.2.0とAndroid 5.0デバイスを検査した後4.0

更新

Android上で私のアプリを実行しています、私はエラーがあることが判明しています

Failed to load resource: net::ERR_FILE_NOT_FOUND file:///login.html Error: [$compile:tpload] Failed to load template: /login.html (HTTP status: -1)

この問題を解決するお手伝いをしますか?

ありがとうございました

+0

前にドットを追加'タグが動作します。代わりにあなたの ''または ''タグに追加しようとしましたか? – Lex

+0

@Lexそれは手書きの間違いで、私は質問を更新しました。私は両方を試みたが、まだ成功していない! –

+0

Google Chromeを使用してアプリケーションをデバッグすることができます。つまり、url場所で 'chrome:// inspect'と入力し、すべてのjsファイルがロードされているかどうかを確認します。 – slackmart

答えて

0

私は最終的に解決策を見つけました。

ちょうど私が `に` NG-app`ディレクティブを置くとは思わない(たとえばviews用)フォルダに私の意見(login.htmlhome.html)を移動し、私のUrlTemplate

$routeProvider 
     //define the routes and their corresponded controllers 
     .when('/home', { 
      templateUrl: './views/home.html', 
      controller: 'homeController' 
     }) 
     .when('/login', { 
      templateUrl: './views/login.html', 
      controller: 'loginController' 
     }) 
     .when('/register', { 
      templateUrl: './views/register.html', 
      controller: 'registerController' 
     }) 
     .otherwise({ 
      redirectTo: './views/home.html' 
     }) 
関連する問題