Question

我用yoeman安装angularjs。但是ngRoute没有用。

我使用角度，角度路线1.6.6 链接有＆＃39;！＃＆＃39;

当我在index.html中编写angular.module ...时路线正在运转。

app.js如何运作？

我的代码

脚本/ app.js

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 -->

Answer 1

试试这个脚本/ 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

<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>

希望有所帮助......

Angular JS 1.6 ngRoute ERROR

1 个答案: