Question

我正在学习AngularJS并且与$routeProvider混淆了一下，我的html中有以下内容：

<div class="container">
  <h1>AngularJS Practice</h1>
  <div ng-view>

  </div>
</div>

在我的app.js文件中，我写了以下内容：

var myApp = angular.module("myApp", ['ngRoute']);

myApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider){
  $routeProvider
    .when('/', {
      templateUrl: 'pages/main.html',
      controller: 'mainController'
    })

    .when('/second', {
      templateUrl: 'pages/second.html',
      controller: 'mainController'
    })
}]);

myApp.controller('mainController', ['$scope', function($scope){
  $scope.name = "Main controller";
}]);

myApp.controller('secondController', ['$scope', function($scope){
  $scope.name = 'Second controller';
}])

在每个模板中，我只写了：

second.html：

<h1>Second</h1>

<h3>Scope name {{ name }}</h3>

main.html：

<h1>Main</h1>

<h3>Scope name: {{ name }}</h3>

我希望$ scope对象在每个控制器中都是不同的，但是当我到达第二条路径（'/second'）时，范围名称仍然是＆＃34;主控制器＆＃34;。我在这里错过了什么吗？

提前致谢。

Answer 1

这两个州都有controller: 'mainController'。

更改以下内容：

.when('/second', {
  templateUrl: 'pages/second.html',
  controller: 'secondController'
})

范围名称未在控制器中隔离？

1 个答案: