如何将输入值输入Angular的$ scope?

时间:2015-06-01 15:25:16

标签: javascript angularjs angularjs-scope angularjs-ng-model

我是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指令的按钮,它触发控制器的功能,我试图获取我的值。

2 个答案:

答案 0 :(得分:13)

该值会自动添加到$scope,但您必须在input元素中输入内容。

那就是说,你需要触发一些东西来获得这个价值。例如,您有评论// get the scope value here的地方 - 一旦控制器初始化并且从未再次调用,就会触发此注释;所以,它当时要记录未定义。但是,如果您将其设置为按钮点击或其他内容,您将看到它可用:

<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);
    }
}]);

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

答案 1 :(得分:0)

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

cv::Mat

并在HTML中执行 $scope.data = [0];

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

或者你可以用对象来处理它 在控制器中: <input type="text" ng-model="data[0]">

HTML中的

$scope.data = {};