Question

我是角度js的新手。

我的控制器是： var myapp = angular.module（'myapp'，['ngRoute']）;

// configure our routes
myapp.config(function($routeProvider) {
    $routeProvider

        // route for the home page
        .when('/', {
            templateUrl : 'pages/person.html',
            controller  : 'personController'
        })

        // route for the contact page
        .when('/add', {
            templateUrl : 'pages/addGroup.html',
            controller  : 'groupController'
        });
});
myapp.controller('groupController', function($scope) {
        $scope.user = 'alex';
        $scope.print = function() 
        {
            alert($scope.user);
        };
    });

我的观点是：

<div ng-controller="groupController">
  Your name: <input type="text" ng-model="user">
    <button ng-click='print()'>Print</button>
  {{user}}
</div>

当我将输入值更改为“mila”时，例如它在视图中的反映，但是当我点击打印按钮时，我仍然会收到“alex”名称的警告。

如何让scope.user也改变？我无法理解这里为2路数据绑定所缺少的内容。谢谢！

Answer 1

这很有效。所以我认为路由有问题，或者有些东西破坏了绑定。

这是你自己没有例程的例子：

＆＃13;

var myApp = angular.module('myApp', []);


myApp.controller("myController", function($scope) {

  $scope.user = 'alex';
  $scope.print = function() {
    alert($scope.user);
  };

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  Your name:
  <input type="text" ng-model="user">
  <button ng-click='print()'>Print</button>
  {{user}}
</div>

＆＃13;

有两种可能的解决方案，严格程度取决于导致问题的原因。

解决方案1 - 将用户传递给打印功能：

＆＃13;

var myApp = angular.module('myApp', []);


myApp.controller("myController", function($scope) {

  $scope.user = 'alex';
  $scope.print = function(user) {
    alert(user);
  };

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  Your name:
  <input type="text" ng-model="user">
  <button ng-click='print(user)'>Print</button>
  {{user}}
</div>

＆＃13;

解决方案2 - 使用comlpex对象：（还要检查this和this。）

＆＃13;

var myApp = angular.module('myApp', []);


myApp.controller("myController", function($scope) {

  $scope.user = {
    name: 'alex'
  };
  $scope.print = function() {
    alert($scope.user.name);
  };

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  Your name:
  <input type="text" ng-model="user.name">
  <button ng-click='print()'>Print</button>
  {{user.name}}
</div>

＆＃13;

Answer 2

三件事，

检查您<div ng-view=""></div>中的index.html或源页面是否有person.html。这是您的不同观点，即路线下所述的观点（addGroup.html，ng-controller="groupController"）将被注入的地方。
从addGroup.html

angular-route.js

仔细检查您在路由下提供的网址是否正确。
您使用的是哪种角度？检查您使用的版本是否需要super.paintComponent。如果是这样，请包含此js。

检查你是否对上述子弹的所有正面评分！

angular js - 范围变量不会改变2路数据绑定

2 个答案: