奇怪的Angular ng模型问题

Weird Angular ng-model issue

本文关键字：模型 问题 ng Angular      更新时间：2023-09-26

关于我的Angular应用，我有一个奇怪的问题。

当用户在输入框中输入文本时，我想获得输入文本。

我html 

<input type="text" class="form-control" ng-model="texts" ng-change="type()"/>
我js 

  $scope.type = function() {
      console.log($scope.texts)
      console.log($scope) //doesn't see texts property either
  }

然而，每次我输入一些东西，第一个控制台日志显示'undefined'。就像控制器找不到文本属性。有人能帮我解决这个奇怪的问题吗?非常感谢!

这可以通过使用angular的双向数据绑定系统来实现:

Angular应用中的数据绑定是数据的自动同步在模型和视图组件之间。Angular实现的方式数据绑定使您可以将模型视为数据的单一来源您的应用程序。视图是模型在任何时候的投影。当模型更改时，视图反映更改，反之亦然。

这允许我们通过在html中绑定控制器范围的属性来同步它们。

那么，我们可以这样定义我们的控制器:

myApp.controller('SomeController', function ($scope) {
  $scope.text = "";
});

现在，我们可以像这样在html中使用它:

<div ng-controller="SomeController">
  <input type="text" class="form-control" ng-model="text" />
</div>

这里需要注意的重要事情是ng-model指令。这里我们将控制器中定义的text属性绑定到<input>字段。现在，使用双向绑定，如果我们在输入字段中输入，它将自动更新text属性。这样，我们就可以访问控制器中输入字段的值，而无需做任何额外的工作。

下面是一个plnkr的工作示例:http://plnkr.co/edit/xEkoDbPxwrWgGfuEiS3a?p=preview

希望有帮助:-)

$scope必须传递给控制器。检查你的控制器参数

相关文章：