AngularJS 表單驗(yàn)證手機(jī)號(hào)的實(shí)例(非必填)
更新時(shí)間：2017年11月12日 11:41:03 作者：FreshCoder_xq
下面小編就為大家?guī)硪黄狝ngularJS 表單驗(yàn)證手機(jī)號(hào)的實(shí)例(非必填)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
代碼如下所示：
<form ng-app="myApp" ng-controller="validateCtrl"
name="myForm" novalidate>
<p>電話:<br>
<input type="text" name="phone" ng-model="phone" ng-pattern="/(^$)|^(((\+86)|(86))?1[34578]\d{9})$/">
<span style="color:red" ng-show="myForm.phone.$dirty && myForm.phone.$invalid">
聯(lián)系電話格式不正確！</span>
</p>
<p>
<input type="submit"
ng-disabled="myForm.$invalid">
</p>
</form>
正則表達(dá)式：
1. 匹配空：^$
2. 匹配手機(jī)號(hào)：^(((\+86)|(86))?1[34578]\d{9})$
3. 控制提示信息的顯示：ng-show="myForm.phone.$dirty && myForm.phone.$invalid"
以上這篇AngularJS 表單驗(yàn)證手機(jī)號(hào)的實(shí)例(非必填)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- AngularJS使用ngMessages進(jìn)行表單驗(yàn)證
- angular實(shí)現(xiàn)表單驗(yàn)證及提交功能
- AngularJS中實(shí)現(xiàn)用戶訪問的身份認(rèn)證和表單驗(yàn)證功能
- 詳解AngularJS中的表單驗(yàn)證(推薦)
- AngularJS手動(dòng)表單驗(yàn)證
- 詳細(xì)解讀AngularJS中的表單驗(yàn)證編程
- AngularJS實(shí)現(xiàn)的獲取焦點(diǎn)及失去焦點(diǎn)時(shí)的表單驗(yàn)證功能示例
- 強(qiáng)大的 Angular 表單驗(yàn)證功能詳細(xì)介紹
- Angular4表單驗(yàn)證代碼詳解
- Angular2.js實(shí)現(xiàn)表單驗(yàn)證詳解
- AngularJS自定義表單驗(yàn)證功能實(shí)例詳解
相關(guān)文章
angularjs實(shí)現(xiàn)柱狀圖動(dòng)態(tài)加載的示例
本篇文章主要介紹了angularjs實(shí)現(xiàn)柱狀圖動(dòng)態(tài)加載的示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12
這篇文章主要為大家詳細(xì)介紹了Angular模板表單校驗(yàn)方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-08-08
Commands Queries設(shè)計(jì)模式提高Angular應(yīng)用性能及可維護(hù)性
在Angular應(yīng)用開發(fā)領(lǐng)域,Commands and Queries 設(shè)計(jì)模式是一個(gè)關(guān)鍵的概念,它有助于有效地管理應(yīng)用程序的狀態(tài)和與后端的交互,本文將深入探討這一設(shè)計(jì)模式的核心要點(diǎn),并通過實(shí)際示例來加以說明2023-10-10
AngularJS動(dòng)態(tài)添加數(shù)據(jù)并刪除的實(shí)例
下面小編就為大家分享一篇AngularJS動(dòng)態(tài)添加數(shù)據(jù)并刪除的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-02-02
Angular依賴注入系統(tǒng)里Injection token PLATFORM_ID使用場(chǎng)景詳解
這篇文章主要為大家介紹了Angular依賴注入系統(tǒng)里Injection token PLATFORM_ID使用場(chǎng)景詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11
這篇文章主要介紹了AngularJS中下拉框的基本用法,結(jié)合具體實(shí)例形式分析了AngularJS下拉框的元素綁定、選中及顯示等功能實(shí)現(xiàn)方法,需要的朋友可以參考下2017-10-10
MODULE_INITIALIZER初始化Angular?懶加載模塊高級(jí)技巧
這篇文章主要為大家介紹了MODULE_INITIALIZER初始化Angular懶加載模塊高級(jí)技巧示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10
本文主要講解AngularJS 過濾器,這里整理了過濾器的相關(guān)資料并附示例代碼，幫助大家學(xué)習(xí)AngularJS的知識(shí)，有需要的小伙伴可以參考下2016-08-08
今天小編就為大家分享一篇對(duì)angular4子路由&輔助路由詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-10-10
本文將側(cè)重點(diǎn)放到npm上來，看看npm平臺(tái)給ng2帶來的酷炫的幫助。具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-03-03