如何向 Angular 9 中的 <mat-label> 添加动态值？

Question

我正在尝试在 Angular 9 中显示一个只读评论页面，其中包含之前填写的表单中给出的所有输入。如果我想使用 mat-label ，如何使用 ngModel ？

例如。，

用户名：ABC；电子邮件地址：abc@abc.com

应从之前填写的表格中获取“ABC”和“abc@abc.com”。我怎样才能实现这个目标？谢谢提前！

Answer 1

我建议您对输入使用双向绑定，因为它们是只读的。

例如

第一步：

.ts

private email:string;

.html

<input [(ngModel)]="email"/>

第二个只读步骤。如果它们位于同一组件中，则只需使用变量绑定

.html（相同.ts）

<mat-label>{{email}}</mat-label>

如果两个页面不在同一组件中，那么您可以使用服务将变量突出显示到服务中，然后您可以从两个组件访问它的值