Question

我有

的html页面

<div ng-controller="MyCtrl">
  <div ng-view>Some content</div>

  myVar: {{myVar}}
</div>

角度控制器：

myModule.controller('MyCtrl', function($scope, $location) {
   $scope.myVar = false;

   $scope.someAction = function() {
     $location.path('/anotherPath');
     $scope.myVar = true; // changes in controller, but not in view
   }
});

我的模块是

var myModule = angular.module('myModule', ['ngRoute']).config(function ($routeProvider) {

$routeProvider
     .when('/anotherPath', {
       templateUrl: 'anotherPath.html',
       controller: 'MyCtrl'
     })

     .otherwise({
         redirectTo: '/anotherPath.html'
     })
});

anotherPath.html仅包含

<input data-ng-click="someAction()" type="button" class="btn" value="Some action">

点击此输入控制器更改路径后，myVar的视图值仍为false。为什么呢？

Answer 1

在这里，您已经定义了两次控制器。一旦进入父div：

<div ng-controller="MyCtrl">

一旦进入/anotherPath的路线：

$routeProvider
     .when('/anotherPath', {
       templateUrl: 'anotherPath.html',
       controller: 'MyCtrl' <-- This will be assigned to <div ng-view>
     })

给你这样的东西：

<div ng-controller="MyCtrl">
    <div ng-view ng-controller="MyCtrl">
    </div>
</div>

因此，当您调用$scope.someAction()时，您正在调用分配给内部视图的控制器上定义的函数，而不是在父控制器上定义的函数。

您应该在路径定义中为View提供自己唯一的控制器：

<强>角：

$routeProvider
     .when('/anotherPath', {
       templateUrl: 'anotherPath.html',
       controller: function($scope) {
           // You don't necessarily need an implementation here
       }
     })

<强> HTML：

<div ng-controller="MyCtrl">
  <div ng-view>Some content</div>

  myVar: {{myVar}}
</div>

变量不会改变角度控制器中的值

1 个答案: