2016-05-16 5 views
0

私は以下の角度のアプリケーションを持っています。コルドバのルートが正常に動作しない

// app.js 

var rippleApp = angular.module('rippleApp', ['ngRoute', 'ngAnimate', 'ngAria', 'ngMaterial']); 

// configure our routes 
rippleApp.config(function ($routeProvider, $compileProvider) { 

    $routeProvider 

     // route for the home page 
     .when('/home', { 
      templateUrl: '../pages/home.html', 
      controller: 'mainController' 
     }) 

     // route for the about page 
     .when('/about', { 
      templateUrl: '../pages/about.html', 
      controller: 'aboutController' 
     }) 

     // route for the contact page 
     .when('/contact', { 
      templateUrl: '../pages/contact.html', 
      controller: 'contactController' 
     }); 
}); 

// create the controller and inject Angular's $scope 

rippleApp.controller('sideNavController', function ($scope, $mdSidenav) { 
    $scope.openLeftMenu = function() { 
     $mdSidenav('left').toggle(); 
    }; 
    $scope.openRightMenu = function() { 
     $mdSidenav('right').toggle(); 
    }; 
}); 

rippleApp.controller('mainController', function ($scope, $mdSidenav) { 
    // create a message to display in our view 
    $scope.pageClass = 'page-home'; 
    $scope.message = 'Everyone come and see how good I look!'; 
    $scope.openLeftMenu = function() { 
     $mdSidenav('left').toggle(); 
    }; 
    $scope.openRightMenu = function() { 
     $mdSidenav('right').toggle(); 
    }; 
}); 

rippleApp.controller('notificationsController', function ($scope, $mdToast, $document) { 
    $scope.showToast1 = function() { 
     $mdToast.show(
      $mdToast.simple() 
       .textContent('Hello World!') 
       .hideDelay(3000) 
     ); 
    }; 

    $scope.showToast2 = function() { 
     var toast = $mdToast.simple() 
      .textContent('Hello World!') 
      .action('OK') 
      .highlightAction(false); 
     $mdToast.show(toast).then(function (response) { 
      if (response == 'ok') { 
       alert('You clicked \'OK\'.'); 
      } 
     }); 
    } 
}); 
rippleApp.controller('aboutController', function ($scope) { 
    $scope.pageClass = 'page-about'; 
    $scope.message = 'Look! I am an about page.'; 
}); 

rippleApp.controller('contactController', function ($scope) { 
    $scope.pageClass = 'page-contact'; 
    $scope.message = 'Contact us! JK. This is just a demo.'; 
}); 

<!DOCTYPE html> 
<html> 
    <head> 
    <!-- 
     Customize the content security policy in the meta tag below as needed. Add 'unsafe-inline' to default-src to enable inline JavaScript. 
     For details, see http://go.microsoft.com/fwlink/?LinkID=617521 
    --> 
     <!-- 
     <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"> 
     <!--Scripts--> 

     <!--Stylesheets--> 
     <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" /> 
     <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" /> 
     <link rel="stylesheet" href="css/bundle.css" /> 
     <link rel="stylesheet" href="css/index.css"> 
     <title>RippleAlpha</title> 
    </head> 
    <body ng-app="rippleApp" ng-controller="mainController"> 

     <header> 
      <nav class="navbar navbar-default"> 
       <div class="container"> 
        <div class="navbar-header"> 
         <div id="sideNavContainer" layout="row" ng-cloak> 
          <md-sidenav md-component-id="left" class="md-sidenav-left">Test case</md-sidenav> 
          <md-content> 
           <md-button class="navbar-brand" ng-click="openLeftMenu()">SM</md-button> 
          </md-content> 
         </div> 
        </div> 

        <ul class="nav navbar-nav navbar-right"> 
         <li><a ng-href="#home"><i class="fa fa-home"></i> Home</a></li> 
         <li><a ng-href="#about"><i class="fa fa-shield"></i> About</a></li> 
         <li><a ng-href="#contact"><i class="fa fa-comment"></i> Contact</a></li> 
        </ul> 
       </div> 
      </nav> 

      <div id="toastContainer" ng-controller="notificationsController as ctrl" layout="row" ng-cloak> 
       <md-button ng-click="showToast1()">notification</md-button> 
       <md-button ng-click="showToast2()">notification - callback</md-button> 
      </div> 
     </header> 
     <div id="main"> 
      <div class="page {{ pageClass }}" ng-view></div> 
     </div> 
     <script src="scripts/bundle.js"></script> 
     <script src="scripts/app.js"></script> 
     <script type="text/javascript" src="cordova.js"></script> 
     <script type="text/javascript" src="scripts/platformOverrides.js"></script> 
     <script type="text/javascript" src="scripts/index.js"></script> 
    </body> 
</html> 

私はルートを取得することができて、ブラウザ/リップルエミュレータでの作業などが、デバイス上でデバッグするとき、私はルーティングを使用することができませんし、ナビゲートがするよ下記のインデックスファイル何もない。

これは角度1.5.X

答えて

0

私の問題を把握しました。

この問題の解決策を探している方は、誰でも参考にしてください。

私problameは、私は、URLを訴えたということでした「../pages*」

これはHTTP URLではなく、むしろ失敗するので:///私は単に「ページで開始し、それを変更しなければなりませんでした/ '相対URL。

問題が解決し、現在作業中です。

関連する問題