来自dom的Angular JS更新模型答案

【问题标题】：Angular JS update model from dom来自dom的Angular JS更新模型
【发布时间】：2013-02-06 22:10:10
【问题描述】：

我已经看到很多关于此的问题，所有这些问题似乎都可以通过调用$scope.$apply()、$scope.$digest() 或在输入上触发 change() 方法来解决。但我似乎无法让它与任何这些方法一起工作。在这个小提琴中，我可以在框中键入一个名称，并在我键入时获取要更新的模型值。但是当我单击链接时，要将输入名称设置为某个值，我希望更新模型名称。我需要做什么？

我尝试这样做的原因是我希望能够在用户使用浏览器自动填充或 LastPass 或类似工具自动填充表单时刷新我的角度模型。肯定有一些角度命令可以从 DOM 刷新模型？

http://jsfiddle.net/PXCUq/

$(function () {
    $('#setFirstName').click(function () {
        $('input.firstname').val('Test Name');
        angular.element($('input.firstname')[0]).scope().$apply();
        // Model still not updated
    });
});

【问题讨论】：

你不这样做有什么原因吗？：<a ng-click="input.firstname = 'Test Name'">set first name</a>?
我正在寻找一种解决方法来使浏览器表单自动填充工作。这是一种更简单的方法，无需用户输入即可更改值，以演示问题。

标签： dom angularjs

【解决方案1】：

获取范围，然后更改 ng-model 属性：

$('#setFirstName').click(function() {
    var scope = angular.element($('input').get(0)).scope()
    scope.firstname = 'Test Name';
    scope.$apply();
});

你可以想出一个更好的 jQuery 选择器。我只关注 Angular 部分。

Fiddle.

【讨论】：

这有点工作......所以要从 dom 刷新模型，我需要遍历每个元素，获取它的 ng-model 属性，然后像这样设置模型值。在 Angular 中真的没有办法做到这一点吗？
你不需要遍历每个元素来获得它的作用域。您只需获得一次范围。喜欢：scope = angular.element($('div[ng-view] > *)[0]).scope()