如何在angular4中保留页面更改时文本框的值答案

【问题标题】：How to retain the value of textbox on page change in angular4如何在angular4中保留页面更改时文本框的值
【发布时间】：2018-10-25 02:41:21
【问题描述】：

我想知道我们更改页面后如何保留文本框中的值，然后再次返回同一页面。在这里，我有一个名为 Transaction 的页面，它通过文本框接受一个值，当我单击它的搜索按钮时，它通过搜索数据库来显示详细信息。然后在输入数据中，我有一个名为 Payload 的按钮，单击该按钮时会显示 Payload Data，现在当我取消该 Payload 页面时，Transaction 页面会重新加载（返回），但搜索框中没有任何数据（条目）。我希望基于发生搜索的相同数据再次出现在文本框中。

   <td style="width:50%">
     <input class="form-control" id="input1-group1 " style="margin-top:20px" 
   type="text" name="search" placeholder="Enter Search Text"
    [(ngModel)]="filterdata" >
    </td>
    <td style="width:50%">
       <button type="submit" class="input-group-addon" 
       style="margin-left:0px;width:65px;margin-top:20px" id="faIcon" 
       (click)="searchByText(filterdata)">
       &nbsp;&nbsp;&nbsp;
      <i class="fa fa-search "></i>
    </button>
    </td>

【问题讨论】：

你的意思是你的文本框数据是空的，然后刷新？
表示...当我返回同一页面时...文本框为空...不是我之前在文本框中搜索的数据
我认为你需要在组件中使用父子关系来保留[(ngModel)]或使用共享服务（不推荐）。
我使用 localStorage（即会话）来存储值。但我不知道用什么来显示值..它是（更改）或（ngValue）或（ngModelChange）或名称....这是什么
检查这是否可以解决您的问题click here

标签： html angular

【解决方案1】：

使用一个组件来存储数据并使其他组件成为它的子组件，当您的应用程序返回时，只需使用 @Input 获取值并使用 [(ngModel)]="something"

【讨论】：