ngModel不能在两个不同的组件中工作？

标题是不言而喻的，所以 - 我把一个输入元素放在app.component.html文件中，这是代码： <input type="text" name="titleInput" id="titleInput" [(ngModel)]="titleInput"> 然后我尝试在另一个组件中创建一个h1元素，因为我希望它显示输入字段中输入的内容。没有工作。在app.component中制作了一个h1元素 - 效果很好。我搜查了很多，但没有找到任何东西。你可以帮我吗？ngModel不能在两个不同的组件中工作？

来源

2017-08-29 Raptrozz

在你的“其他”组件，您使用的延迟加载？ – brijmcq

那些组件是否有父子关系？ – Rahul

您可以使用您的模型titleInput，通过input来操作，在您的情况下，使用插值在您的标题标签中显示，即{{.}}。

例如：

<div> 
    <h1>{{titleInput}}</h1> 
    <input type="text" name="titleInput" id="titleInput" [(ngModel)]="titleInput"/> 
</div>

你可以看到它的工作here。

来源

2017-08-29 00:48:55 mok

在这个例子中，我可以看到它的工作原理，但它在同一个组件中起作用。我试图使用字符串插值，但h1元素在另一个组件中，然后它不。 – Raptrozz

有两种方法。

要么与子女父母的关系@Input。 https://angular.io/guide/component-interaction（看其他帖子）。

或在第一组件中使用LocalStorage.setItem('titleInput', titleInput);。

而在第二LocalStorage.getItem('titleInput');和LocalStorage.removeItem('titleInput');

来源

2017-08-29 06:15:09 Swoox

那么，我应该在另一个组件的ts文件中输入“@Input（）titleInput”，对吧？ – Raptrozz

ngModel不能在两个不同的组件中工作？

回答

相关问题