2016-09-08 53 views
0

如果用戶輸入值大於1並且輸入字段不包含正則表達式中定義的值,則只需顯示跨度。如果長度和ng模式不滿足,則隱藏元素角度

代碼:

<!doctype html> 
<html lang="en"> 

<head> 
    <meta charset="UTF-8"> 
    <title>Example - example-ng-form-production</title> 


    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.js"></script> 


    <script type="text/javascript"> 
    angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="' + window.location.pathname + '" />')); 
    </script> 
</head> 

<body ng-app="formExample"> 
    <script> 
    angular.module('formExample', []) 
     .controller('FormController', ['$scope', function($scope) { 
     $scope.userType = ''; 
     $scope.regex = "#%<;'="; 
     }]); 
    </script> 
    <form name="myForm" ng-controller="FormController" class="my-form"> 
    userType: 
    <input name="input" ng-model="userType" ng-pattern="regex && userType"> 
    <span ng-show="userType && myForm.input.$valid">show me!</span> 
    <br> 
    </form> 
</body> 

</html> 

Plunker Demo

回答

1

如果您需要在沒有你的正則表達式模式的進入,你需要一個排除掩模:

$scope.regex = "[^#%<;'=]*"; 

而且在模式中使用一個沒有條件掩碼:

<input name="input" ng-model="userType" ng-pattern="regex"> 

猛擊here

0

NG-圖案僅驗證正則表達式。所以在ng-pattern裏面應該只是模式。在顯示消息時,請檢查ng-show或ng-hide內的userType和其他表單屬性。就這樣。

<form name="myForm" ng-controller="FormController" class="my-form"> 
userType: 
<input name="input" ng-model="userType" ng-pattern="regex"> 
<span ng-show="userType && !myForm.input.$error.pattern">show me!</span> 
<br> 

+0

它不起作用 –

+0

給出一個模式的例子 –

+0

在plunker中添加以及它在代碼中附加 –

相關問題