第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

當(dāng)用戶在搜索欄中輸入文本時(shí)顯示列

當(dāng)用戶在搜索欄中輸入文本時(shí)顯示列

哆啦的時(shí)光機(jī) 2023-10-10 16:54:37
我正在做 Angular 項(xiàng)目,想知道當(dāng)用戶在搜索欄中輸入任何文本時(shí)如何顯示中間列。現(xiàn)在,我有用于用戶輸入的搜索欄和三個(gè)彈性列。當(dāng)頁面打開時(shí),中間的列是隱藏的,但我希望當(dāng)用戶在搜索框中輸入任何文本時(shí)它會(huì)顯示。任何幫助將非常感激。.left {  flex: 2;}.right {  flex: 1;}.center{  flex: 1;  display: none;}.parent {  display: flex;  overflow: hidden;  width: 95vw;  margin-left: 30px;}<!-- Middle Column --!>    <div class="center">        <div class="chart-header">Charts</div>          <div>Chart will display here</div>    </div>      <!-- My user input/ search bar --!>  <input  [formControl]="inputCtrl" matInput class="input">
查看完整描述

2 回答

?
開心每一天1111

TA貢獻(xiàn)1836條經(jīng)驗(yàn) 獲得超13個(gè)贊

// .html file      

 <div class="center" *ngIf="showColumn">

            <div class="chart-header">Charts</div>  

            <div>Chart will display here</div>

        </div>



   //.ts file

   showColumn = false;

     this.form.get('inputCtrl').valueChanges.subscribe(() => {

    this.showColumn = true;

  });


查看完整回答
反對(duì) 回復(fù) 2023-10-10
?
呼如林

TA貢獻(xiàn)1798條經(jīng)驗(yàn) 獲得超3個(gè)贊

您可以訂閱表單控制器的 valueChanges 事件


TS文件


this.form.get("inputCtrl").valueChanges.subscribe(selectedValue => {

  this.displayStyle = 'block';

})

HTML 文件


<div class="center" [ngStyle]="{'display':displayStyle}>

    <div class="chart-header">Charts</div>  

    <div>Chart will display here</div>

</div>


查看完整回答
反對(duì) 回復(fù) 2023-10-10
  • 2 回答
  • 0 關(guān)注
  • 135 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)