角度-在另一个组件的输入文本框中设置值

Question

我试图设置的值在超文本标记语言输入框是ComponentA的一部分，从打字代码是ComponentB的一部分。

从中得到一个线索，所以我试着做：

(<HTMLInputElement>document.getElementById("name")).value = response.name;

但这不起作用。还有什么需要我照顾的吗？

编辑：具有Id"name"的元素在ComponentA中，尝试操作该元素的上述代码在ComponentB中

Answer 1

这是一个组件ComponentA上的用户交互触发另一个组件ComponentB更新的情况之一。

本文介绍了关于如何在组件之间传递信息的多种方法，并给出了示例代码。

我个人最喜欢的是那篇文章中提到的第三种方法，其中一个组件（比如ComponentA）通过它们之间的服务“监听”任何组件（比如ComponentB）的更新，从而产生松散耦合的组件。

对于更多的方法，这里是另一个链接。

Answer 2

如果试图从Component2设置component1文本字段的值，则必须使用ngModel即双向数据绑定。通过在提供者列表中提供component2，您可以访问该组件的所有函数和变量，然后您可以轻松设置值。这样地

假设这是组件2的value属性

name:string = 'Pardeep Jain';

这样你就可以在组件中访问它了-

<input type="text" [(ngModel)]='name'>
....
constructor(private delete1: Delete){
   this.name = this.delete1.name;
}

工作示例

也

(<HTMLInputElement>document.getElementById("name")).value = response.name;

用于设置当前模板id为**name**