javascript - 如何使用 angular.element ('#id' 获取输入元素的值)

Question

当我尝试使用 angular.element 获取输入元素的值时，它返回未定义。这是我的代码:

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

如何使用 angular.element 获取值

Answer 1

说明

你应该使用 val类似于 jQuery 的 $.fn.val 的方法:

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

或者，您可以使用纯 HTMLInputELement 的 value 属性:

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

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

正确的做法

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

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

你在 HTML 中的什么地方

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