亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在新選項卡上保留輸入值

在新選項卡上保留輸入值

一只斗牛犬 2021-09-30 14:56:25
當一個值輸入到輸入中并在新選項卡中打開窗口時,我希望該值仍顯示在新選項卡上。這可以window.localStorage用來實現這一目標嗎?請參閱Stackblitz<input style="border: red solid 2px;" placeholder=" enter text...">  <button id="btn" style="background:red"      (click)="openNewTab()" routerLink="/{{ href }}">    Open-In-New-Tab >  </button>export class About{  title: string = "About Page.";    public href: String = '';    constructor(private router: Router, private route:ActivatedRoute){ }  openNewTab() {    window.open('' + this.href + '?show=false', '_blank').focus();  }  ngOnInit() {    this.href = decodeURI(this.router.url.replace(/\/.*\//g, ''));    this.route.queryParams.subscribe(params => {      if (params.show === 'false') {        document.getElementById('navigation').outerHTML = '';        document.getElementById('btn').outerHTML = '';      }    });  }}實際結果:輸入值在新選項卡中消失。預期結果:新打開的選項卡應該保留輸入值
查看完整描述

1 回答

?
猛跑小豬

TA貢獻1858條經驗 獲得超8個贊

是的,確實,您可以window.localStorage通過window.sessionStorage. 我會在帖子的末尾解釋原因。


您必須(change)在輸入時使用事件才能保存您輸入的值。您還必須添加[(ngModel)]到<input>


模板


<input [(ngModel)]="inputValue" (change)="setValue($event.target.value)">

成分


export class MyComponent {

  inputValue = '';


  ngOnInit() {

    this.inputValue = window.sessionStorage.getItem('savedValue');

  }


  setValue(value) {

    window.sessionStorage.setItem('savedValue', value);

  }

}

這將在您打開新選項卡時保留該值。請記住,如果您刷新初始頁面,該值也將被保留。如果您使用sessionStorage,如果您重新打開瀏覽器,該值將消失。隨著localStorage那會不會是視情況localStorage永不過期。


閃電戰


如果您希望該值僅在頁面在選項卡中重新打開時才存在,我建議您將其作為 URL 中的查詢字符串傳遞。然后在 Angular 中,您將查看該查詢字符串是否存在于 URL 中并顯示該值(直接來自查詢字符串,或來自存儲)


查看完整回答
反對 回復 2021-09-30
  • 1 回答
  • 0 關注
  • 171 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號