2016-05-16 124 views
0

我有以下的角度应用程序。Cordova ng路径不能正常工作

// 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和而失效:///我不得不改变它在“页面开始/'相对网址。

问题解决了,现在的工作。