Question

我的表单有以下内联验证

delete threadPtr

但验证仅适用于<form name="coForm" novalidate> <div> <label>Transaction: </label> <input type="text" name="transaction" class="form-control" placeholder="<Direction> <Message Type>, ex.:OUT X12214" ng-model="newco.transaction" ng-pattern=/(^(IN )([A-Za-z0-9 &_]+))|(^(OUT )([A-Za-z0-9 &_]+))/ required> <span style="color:red" ng-show="coForm.transaction.$dirty || coForm.transaction.$invalid"> <span ng-show="coForm.transaction.$error.pattern"> Enter correct value for Transaction </span> <span ng-show="coForm.transaction.$error.required"> Transaction is required. </span> </div> </form>，而不适用于required

Here is the fiddle

以下是积极匹配的几个例子：

pattern

Answer 1

您错过了ng-pattern属性＆amp;的双引号你还没有在页面上初始化角度，你需要添加ng-app以在页面上运行角度

<强>标记

<form name="coForm" novalidate ng-app="">
    <div>
        <label>Transaction:</label>
        <input type="text" name="transaction" class="form-control" placeholder="<Direction> <Message Type>, ex.:OUT X12214" ng-model="newco.transaction" 
        ng-pattern="/(^(IN )([A-Za-z0-9 &_]+))|(^(OUT )([A-Za-z0-9 &_]+))/" required>   
        <span style="color:red" ng-show="coForm.transaction.$dirty || coForm.transaction.$invalid">
           <span ng-show="coForm.transaction.$error.pattern">Enter correct value for Transaction</span>
            <span ng-show="coForm.transaction.$error.required">Transaction is required.</span>
        </span>
    </div>
</form>

JsFiddle

Answer 2

Use && instead of ||

ng-show="coForm.transaction.$dirty && 
              coForm.transaction.$invalid">

ng-pattern不使用正则表达式

2 个答案: