AngularJS - 将 this.value 传递给函数答案

【问题标题】：AngularJS - passing this.value into a functionAngularJS - 将 this.value 传递给函数
【发布时间】：2014-10-20 19:01:35
【问题描述】：

我在本机 javascript 中有这段代码，它可以正常工作。它记录文本框的当前值

<script>
    var boom = function(val) {
        console.log(val);
    };
</script>

<input type="text" onclick="boom(this.value)"/>

然后我想在不使用模型的情况下在 AngularJS 上做同样的事情。代码如下：

$scope.boom = function(val) {
    console.log(val);
};

<input type="text" ng-click="boom(this.value)"/>

但它总是记录 undefined！
为什么？

【问题讨论】：

【解决方案1】：

据我所知，this 在ng-* 的上下文中是scope。
您可以通过boom($event.target.value)访问。

【讨论】：

【解决方案2】：

Angular 的方式是使用ngModel:

<input type="text" ng-model="input" ng-click="boom()"/>

在控制器中：

var boom = function() {
    console.log($scope.input);
};

this.input 也可以工作，因为this 指向当前范围对象。

如果你仍然想避免模型，那么你可以使用事件对象：

<input type="text" ng-click="boom($event)"/>

和

var boom = function($event) {
    console.log($event.target.value);
};

【讨论】：

【解决方案3】：

'value' 未在范围内定义。

我将扩展一点 Miraage 答案..

this 将引用范围。如果要访问 DOM 元素，请使用 $event。在回调函数中你可以使用boom($event.target.value)获取DOM元素值

【讨论】：