Javascript 如何将输入值输入到 Angular 的 $scope 中?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/30577311/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 05:24:52  来源:igfitidea点击:

How do I get an input value into Angular's $scope?

javascriptangularjsangularjs-scopeangularjs-ng-model

提问by Arhyaa

I'm new to Angular, and I am trying to do something really basic. Here is a part of a view (all angular files are added elsewhere) :

我是 Angular 的新手,我正在尝试做一些非常基本的事情。这是视图的一部分(所有角度文件都添加到别处):

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

And here is my controller :

这是我的控制器:

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

    // get the scope value here
}]);

What I'm trying to do is really simple. I'd like to use the input value. I tried something like $scope.data = []and $scope.data.push($scope.id)to create an array with the scope's value, but it didn't work. When I tried to display the value, I got an 'undefined' on the console.

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

Do you guys have any idea ?

你们有什么想法吗?

Edit : The view also has a button with the ng-clickdirective which trigger the controller's function where I try to get my value.

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

回答by Tom

The value will automatically be added to the $scope, but you have to type something into the inputelement.

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

That said, you need to trigger something to get this value. For example, where you have your comment // get the scope value here-- this is triggered as soon as the controller is initialized and never called again; so, it's going to log undefined at that time. However, if you set it to a button click, or something, you will see it's available:

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

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

And your controller:

还有你的控制器:

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

Now type something into the input and click the button.

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

回答by Tamaro Tamaroidny

If you really need it in array, just do this in your controller:

如果您真的需要它在数组中,只需在您的控制器中执行此操作:

$scope.data = [0];

$scope.data = [0];

and in HTML do <input type="text" ng-model="data[0]">

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

It will fill that array value automaticaly as you type something in INPUT, id will be always at first position in array.

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

Or you can handle it with object In controller: $scope.data = {};

或者您可以使用对象在控制器中处理它: $scope.data = {};

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

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