快捷導(dǎo)航

Angular限制input框輸入金額（是小數(shù)的話只保留兩位小數(shù)點(diǎn)）

更新時(shí)間：2017年07月13日 15:34:54 作者：lorena0928

最近做項(xiàng)目遇到這樣的需求輸入框要求輸入金額，只能輸入數(shù)字，可以是小數(shù)，必須保留小數(shù)點(diǎn)后兩位。下面分為兩部分代碼給大家介紹實(shí)現(xiàn)代碼，需要的的朋友參考下吧

需求

輸入框要求輸入金額，只能輸入數(shù)字，可以是小數(shù)，必須保留小數(shù)點(diǎn)后兩位。

js判斷部分：

checkInput: function (event) { 
var id = event.target.getAttribute(“id”);//獲取input的id 
var reg = /^[-?\d]+(.)?(\d{1,2})?/;//匹配正則while(!reg.test(('#' + id).val()) && (‘#' + id).val() != “”) {('#' + id).val(scope.checkStr((‘#' + id).val()));//判斷輸入的內(nèi)容是不是除了‘-'、‘小數(shù)點(diǎn)'、‘?dāng)?shù)字'，不是的情況輸入框內(nèi)容不會(huì)保存。 
} 
}, 
//檢查是否符合金額格式:只能輸入數(shù)字且最多保留小數(shù)點(diǎn)后兩位 
checkStr: function (str) { 
str = str.substring(0, str.length - 1); 
return str; 
}

html：

<input type="text" required class="form-control input- 
margin- btm20 input-common input-width250" 
ng-model="addNewuser.fee" 
placeholder="請(qǐng)保留小數(shù)點(diǎn)后兩位" ng-keyup="checkInput($event)>

以上所述是小編給大家介紹的Angular限制input框輸入金額（是小數(shù)的話只保留兩位小數(shù)點(diǎn)），希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

Angular ElementRef簡(jiǎn)介及其使用
這篇文章主要介紹了Angular ElementRef簡(jiǎn)介及其使用，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-10-10
詳解angular 中的自定義指令之詳解API
本篇文章主要介紹了angular 中的自定義指令之詳解API，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-06-06
AngularJS中的過濾器filter用法完全解析
這篇文章主要介紹了AngularJS中的過濾器filter用法,包括Angular中一些常用的自帶的過濾器的列舉以及自定義filter的方法,需要的朋友可以參考下
2016-04-04
Angular2學(xué)習(xí)教程之TemplateRef和ViewContainerRef詳解
這篇文章主要給大家介紹了Angular2中TemplateRef和ViewContainerRef的相關(guān)資料，文中介紹的非常詳細(xì)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起看看吧。
2017-05-05
Angular使用ng-messages與PHP進(jìn)行表單數(shù)據(jù)驗(yàn)證
這篇文章主要介紹了Angular使用ng-messages與PHP進(jìn)行表單數(shù)據(jù)驗(yàn)證，ng-messages提供了更方便的表單數(shù)據(jù)驗(yàn)證服務(wù)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-12-12
Angularjs中三種數(shù)據(jù)的綁定策略(“@”，“=”，“&”)
在AngularJS的指令中存在著三種綁定策略，他們分別是’=’,’@’,’&’。下面這篇文章主要介紹了Angularjs中這三種數(shù)據(jù)的綁定策略，有需要的朋友們可以參考借鑒，下面來一起看看吧。
2016-12-12
Angular.JS去掉訪問路徑URL中的#號(hào)詳解
最近天天都在用AngularJS，各類文檔也都看過好幾遍，但總是些編程上的事找不到優(yōu)雅的解決辦法。今天終于把AngularJS的項(xiàng)目訪問路徑URL里的#號(hào)去掉了，這個(gè)問題不見得有多難，關(guān)鍵是花多長(zhǎng)時(shí)間去理解AngularJS框架本身，下面來看看詳細(xì)介紹，需要的朋友可以參考下。
2017-03-03
Angular實(shí)現(xiàn)一個(gè)簡(jiǎn)單的多選復(fù)選框的彈出框指令實(shí)例
下面小編就為大家?guī)硪黄狝ngular實(shí)現(xiàn)一個(gè)簡(jiǎn)單的多選復(fù)選框的彈出框指令實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-04-04
Angular4.0中引入laydate.js日期插件的方法教程
在AngularJs中我們會(huì)不可避免的使用第三方庫，例如jquery插件庫。下面這篇文章主要給大家介紹了關(guān)于Angular4.0中引入laydate.js日期插件的相關(guān)資料，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2017-12-12
淺談Angularjs中不同類型的雙向數(shù)據(jù)綁定
這篇文章主要介紹了淺談Angularjs中不同類型的雙向數(shù)據(jù)綁定，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-07-07