如何使用angular.element（'#id'）获取输入元素的值 [英] How do I get the value of an input element using angular.element('#id')

问题描述

当我尝试使用angular.element获取input元素的值时，返回undefined。
这是我的代码：

When I'm trying to get the value of input element using angular.element, its returning undefined. Here is my code:

$scope.registerUser = function() {
    console.log(angular.element('#username').value); // undefined
    console.log(document.getElementById('username').value); // sampleName
};

如何使用angular.element获取值

How do I get the value using angular.element

推荐答案

解释

您应该使用 val 方法类似于jQuery的 $。fn.val ：

console.log(angular.element('#username').val());

或者您可以使用值属性纯HTMLInputELement：

Alternatively you can use value property of the pure HTMLInputELement:

console.log(angular.element('#username')[0].value);

...因为 angular.element 实例是一个类似于数组的类似于HTMLElements的集合，每个元素都可以通过索引访问。

... because angular.element instance is an array-like collection of HTMLElements with every element accessible by its index.

但是。 ..你不应该在Angular应用程序的上下文中读取这样的输入值。相反，使用 ngModel 指令并将输入值直接绑定到角度模型：

But... You should never read input value like this in context of Angular app. Instead, use ngModel directive and bind input value to angular model directly:

$scope.registerUser = function() {    
    console.log($scope.username);
};

您在HTML中的位置

<input type="text" ng-model="username">

这篇关于如何使用angular.element（'#id'）获取输入元素的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！