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

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

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

如何使用 angular.element 获取值

解释

你应该使用val https://docs.angularjs.org/api/ng/function/angular.element类似于jQuery的方法$.fn.val http://api.jquery.com/val/:

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

或者你可以使用value纯 HTMLInputELement 的属性：

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

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

正确做法

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

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

HTML 中的哪个位置

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