Question

我有这样的输入：

<input ng-model="mysearch.myfield" id="myid"/>

绑定到过滤器

<table><tr ng-repeat="row in list|filter:mysearch">...</tr></table>

如果我在GUI中修改输入值，它可以很好地工作，但如果我尝试通过javascript / jquery修改其值

$("#myid").val("newvalue")

输入值已更新但mysearch.myfield未修改

实际上，我有一个列在用户操作上的列表（在页面加载时不存在）：

<li onclick="changeTheInputValue('newvalue1')">newvalue1</li>
<li onclick="changeTheInputValue('newvalue2')">newvalue2</li>
...

与

function changeTheInputValue(v) {
  $("#myid").val(v);
}

当我点击＆＃34; li＆＃34;它不起作用。（更新输入值，不修改mysearch.myfield）

我也试过

<li ng-click="mysearch.myfield = 'newvalue1'">newvalue1</li>
<li ng-click="mysearch.myfield = 'newvalue2'">newvalue2</li>
...

但它不起作用:( 有什么想法吗？

谢谢，

Answer 1

任何在angulars事件循环之外执行的javascript在角色中都是有效的，直到你应用它为止。为了做到这一点，你需要获得相关的范围和$应用更改，因为不清楚，如何以及为什么你修改角度范围之外的值没有什么我可以说除了你可以做类似的事情

function changeTheInputValue(v) {
     $("#myid").val(v);
     angular.element($("#myid")).scope().$apply();
}

应该让角度知道变化，如果使用角度，这是一个糟糕的设计。有更好的方法来完成同样的事情，没有混合执行范围。（角/其余）;

Answer 2

您正在使用直接DOM操作修改输入"#myid"的值。 AngularJS没有意识到这一点。如果您希望html和mysearch.myfield的值都能正确更新，则必须通过直接修改mysearch.myfield属性来实现，无论是在控制器中还是通过ng-model绑定或类似的东西。 / p>

这对你不起作用的主要原因与AngularJS如何修改DOM有关。当您使用jQuery修改DOM时，您正在绕过角度。 Angular无法知道你是否在DOM中改变了某些东西，除非你直接通过Angular本身做了。特别是，如果您感到好奇，请阅读$compile和$digest服务。

希望这有助于阐明这个问题！

angular js输入绑定值

2 个答案: