Angular 6：当jquery更新字段时组件值不更新[重复]

【问题标题】：Angular 6: Component value not updating when field is updated by jquery [duplicate]Angular 6：当jquery更新字段时组件值不更新[重复]
【发布时间】：2018-07-18 09:56:13
【问题描述】：

我刚刚注意到，当输入字段的值通过 jquery 更新时，绑定到 Inputfield 的组件中的值没有更新。

组件.ts

export class AppComponent{
searchString = "";
}

HTML

<input id="txSearchstring" type="text" [(ngModel)]="searchString"  >

jquery

$('#txSearchstring').val('this is a test data');

当我尝试记录 searchString 的值时，该值仍然为空。

有什么建议吗？

【问题讨论】：

您的问题到底是什么，请与您面临的预期问题分享相关代码和用例
我刚刚按问题更新了。

标签： angular angular6

【解决方案1】：

Angular 猴子使用区域修补浏览器事件、setTimeout、setInterval 和 ajax 调用以运行更改检测机制。每次更改检测代码运行时，它都会检查绑定到模板的所有值的更改。现在，当您通过 jQuery 更改输入字段的值时，不会调用浏览器更改事件，因此不会运行更改检测，因此更改的输入字段值不会反映在绑定属性“searchString”中。之后像这样手动运行更改检测 $('#txSearchstring').val('this is a test data'); 将解决问题：

ChangeDetectorRef.detectChanges()（仅检查当前组件及其子组件）。这里 ChangeDetectorRef 是一个可以注入的依赖项

【讨论】：

谢谢，不幸的是，这不起作用。我已经添加了 .detectChanges() 并每隔几秒调用一次，但是 ts 中的值仍然没有更新。