最近2018中文字幕在日韩欧美国产成人片_国产日韩精品一区二区在线_在线观看成年美女黄网色视频_国产精品一区三区五区_国产精彩刺激乱对白_看黄色黄大色黄片免费_人人超碰自拍cao_国产高清av在线_亚洲精品电影av_日韩美女尤物视频网站

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
angular4應(yīng)用中如何輸入最小值和最大值-創(chuàng)新互聯(lián)

小編給大家分享一下angular4應(yīng)用中如何輸入最小值和大值,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

柳河網(wǎng)站制作公司哪家好,找創(chuàng)新互聯(lián)公司!從網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、成都響應(yīng)式網(wǎng)站建設(shè)公司等網(wǎng)站項目制作,到程序開發(fā),運(yùn)營維護(hù)。創(chuàng)新互聯(lián)公司于2013年成立到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗和運(yùn)維經(jīng)驗,來保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)公司。

Angular4輸入屬性

輸入屬性通常用于父組件向子組件傳遞信息

舉個栗子:我們在父組件向子組件傳遞股票代碼,這里的子組件我們叫它app-order

首先在app.order.component.ts中聲明需要由父組件傳遞進(jìn)來的值

order.component.ts

...

@Input()

stockCode: string

@Input()

amount: string

...

order.component.html

這里是子組件

股票代碼為{{stockCode}}

股票總數(shù)為{{amount}}

然后我們需要在父組件(app.component)中向子組件傳值

app.component.ts

...

stock: string

...

app.component.html



這里我們使用了Angular的雙向數(shù)據(jù)綁定,將用戶輸入的值和控制器中的stock進(jìn)行綁定。然后傳遞給子組件,子組件接收后在頁面顯示。

Angular4輸出屬性

當(dāng)子組件需要向父組件傳遞信息時需要用到輸出屬性。

舉個栗子:當(dāng)我們從股票交易所獲得股票的實時價格時,希望外部也可以得到這個信息。為了方便,這里的實時股票價格我們通過一個隨機(jī)數(shù)來模擬。這里的子組件我們叫它app.price.quote

使用EventEmitter從子組件向外發(fā)射事件

price.quote.ts

export class PriceQuoteComponent implements OnInit{

 stockCode: string = 'IBM';

 price: number;

 //使用EventEmitter發(fā)射事件

 //泛型是指往外發(fā)射的事件是什么類型

 //priceChange為事件名稱

 @Output()

 priceChange:EventEmitter = new EventEmitter();

 constructor(){

 setInterval(() => {

  let priceQuote = new PriceQuote(this.stockCode, 100*Math.random());

  this.price = priceQuote.lastPrice;

  //發(fā)射事件

  this.priceChange.emit(priceQuote);

 })

 }

 ngInit(){

 }

}

//股票信息類

//stockCode為股票代碼,lastPrice為股票價格

export class PriceQuote{

 constructor(public stockCode:string,

  public lastPrice:number

 )

}

price.quote.html

 這里是報價組件

 股票代碼是{{stockCode}}

 股票價格是{{price | number:'2.2-2'}}

接著我們在父組件中接收事件

app.component.html



 這是在報價組件外, 股票代碼是{{priceQuote.stokcCode}},  股票價格是{{priceQuote.lastPrice | number:'2.2-2'}}

事件綁定和原生的事件綁定是一樣的,都是將事件名稱放在()中。

app.component.ts

export class AppComponent{

 priceQuote:PriceQuote = new PriceQuote('', 0);

 priceQuoteHandler(event:PriceQuote){

 this.priceQuote = event;

 }

}

這里的event類型就是子組件傳遞事件的類型。

angular4應(yīng)用中輸入的最小值和大值的方法

我有一個帶有表單的angular4應(yīng)用程序.在這個我輸入一個百分比輸入.所以,我想用0到100之間的值來阻止輸入.

我試圖添加min =“0”和max =“100”,但我仍然可以輸入一個高于100或小于0的數(shù)字.

模板


 
 Required field

你知道我怎么做嗎?

解決方法

我成功地使用了表單控件.

這是我的HTML代碼:


    
    Please enter a value between 0 and 100
  

在我的打字稿代碼中,我有:

this.rateControl = new FormControl("",[Validators.max(100),Validators.min(0)])

因此,如果我們輸入的值大于100或小于0,則材料設(shè)計輸入變?yōu)榧t色且該字段未驗證.所以之后,如果值不好,我點(diǎn)擊保存按鈕時就不保存.

以上是“angular4應(yīng)用中如何輸入最小值和大值”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!


本文標(biāo)題:angular4應(yīng)用中如何輸入最小值和最大值-創(chuàng)新互聯(lián)
文章轉(zhuǎn)載:http://fisionsoft.com.cn/article/deshpj.html