如何获取 Angular 的 $scope 的输入值？答案

【问题标题】：How do I get an input value into Angular's $scope?如何获取 Angular 的 $scope 的输入值？
【发布时间】：2015-06-01 15:25:15
【问题描述】：

我是 Angular 的新手，我正在尝试做一些非常基本的事情。这是视图的一部分（所有角度文件都添加到其他地方）：

 <div ng-controller='ctrl'>
    <input type='text' ng-model='id'>
 </div>

这是我的控制器：

 module.controller('ctrl',['$scope', function ($scope) {

    // get the scope value here
}]);

我想要做的非常简单。我想使用输入值。我尝试了类似$scope.data = [] 和$scope.data.push($scope.id) 的方法来创建一个具有范围值的数组，但它不起作用。当我尝试显示该值时，控制台上出现了“未定义”。

你们有什么想法吗？

编辑：视图还有一个带有ng-click 指令的按钮，它触发控制器的功能，我尝试在其中获取我的值。

【问题讨论】：

你在input中输入了什么吗？
我输入了一些东西，并且（我没有在原帖上写）我有一个按钮，带有一个链接到控制器中的函数的ng-click 指令。
编辑问题的标题，以便说明您面临的问题，“只是尝试用 AngularJS 的 ngModel 做一些基本的事情”告诉我什么。你不会问你的父母“我正在尝试用炉子做饭”......“好吧，有什么问题？你在做什么？有什么问题？”。
我会将ng-click 添加到问题中。 “按原样”发布代码 - 不是一个紧密的表示......小错误可能看起来像大问题。
查看我的博文。它可能对您有用：espeo.pl/angularjs-how-properly-use-watch-and-watchcollection

【解决方案1】：

该值将自动添加到$scope，但您必须在input 元素中输入一些内容。

也就是说，你需要触发一些东西来获得这个值。例如，如果您有评论// get the scope value here - 一旦控制器初始化并且不再调用，就会触发它；所以，它会在那个时候记录 undefined 。但是，如果您将其设置为单击按钮或其他方式，您将看到它是可用的：

<div ng-controller='ctrl'>
   <input type='text' ng-model='id'>
   <button ng-click="logId()">Log ID</button>
</div>

还有你的控制器：

module.controller('ctrl',['$scope', function ($scope) {
    $scope.logId = function() {
        console.log($scope.id);
    }
}]);

现在在输入中输入一些内容并单击按钮。

【讨论】：

嗯，我的错，我忘了提。我在视图上有一个按钮，ng-click 指令链接到控制器中的函数以触发它。我会把它添加到原帖中！
您能否提供一个不起作用的jsBin 或jsFiddle？我提供的代码工作正常：jsbin.com/wuhiciwibi/1/edit?html,js,console,output@Arhyaa
我在主视图中从angular.min.js 切换到angular.js，并且成功了。

【解决方案2】：

如果你真的需要它在数组中，只需在你的控制器中执行此操作：

$scope.data = [0];

在 HTML 中做 <input type="text" ng-model="data[0]">

当您在 INPUT 中键入内容时，它将自动填充该数组值，id 将始终位于数组中的第一个位置。

或者你可以用对象来处理它在控制器中： $scope.data = {};

在 HTML <input type="text" ng-model="data.id">

【讨论】：