2017-09-19 15 views
0

私はanglejsをyoemanと一緒にインストールします。 でもngRouteは機能しません。私はangular.moduleを書くときAngular JS 1.6 ngRoute ERROR

私は角度、角速度、ルート1.6.6 リンクを使用しては '!#'

を持っている...のindex.htmlに ルートが働いています。

app.jsはどのように機能しますか?

angular.module('myPageApp', ['ngRoute']) 
    .config(function ($routeProvider, $locationProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainCtrl', 
     controllerAs: 'main' 
    }) 
    .when('/about', { 
     templateUrl: 'views/about.html', 
     controller: 'AboutCtrl', 
     controllerAs: 'about' 
    }) 
    .otherwise({ 
     redirectTo: '/' 
    }); 
    $locationProvider.hashPrefix(''); 
}); 

のindex.html:

私のコード

スクリプトは、/

angular.module('myPageApp', ['ngRoute']) 
    .config(function ($routeProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainCtrl', 
     controllerAs: 'main' 
    }) 
    .when('/about', { 
     templateUrl: 'views/about.html', 
     controller: 'AboutCtrl', 
     controllerAs: 'about' 
    }) 
    .otherwise({ 
     redirectTo: '/' 
    }); 
}); 

index.htmlを

<ul class="nav navbar-nav"> 
    <li class="active"><a href="#!/">Home</a></li> 
    <li><a ng-href="#!/about">About</a></li> 
    <li><a ng-href="#/">Contact</a></li> 
</ul> 

<div class="container"> 
    <ng-view></ng-view> 
    <div ng-view></div> 
</div> 

<!-- build:js(.) scripts/vendor.js --> 
<!-- bower:js --> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-route.js"></script> 

<!-- endbower --> 
<!-- endbuild --> 

<!-- build:js({.tmp,app}) scripts/scripts.js --> 
<script src="scripts/app.js"></script> 
<script src="scripts/controllers/main.js"></script> 
<script src="scripts/controllers/about.js"></script> 
<!-- endbuild --> 
+1

...それがお役に立てば幸いですか!何が効いていないのですか? –

+0

ng-viewが機能していません。 タグ(ng-href = "#!/")をクリックしたときに表示(main.html)を読み込まない – Minhyeong

+0

デベロッパーツール –

答えて

0

このスクリプト/ app.jsをお試しくださいapp.js

<ul class="nav navbar-nav"> 
    <li class="active"><a href="#/">Home</a></li> 
    <li><a ng-href="#/about">About</a></li> 
    <li><a ng-href="#/">Contact</a></li> 
</ul> 

が働いている何

+0

は動作しません... :( – Minhyeong

関連する問題