Question

我正在开发Angular js项目，我需要在提交表单之前验证输入的数据。

<select class="form-control" id="offerType" ng-model="addOffer.discount">
            <option value="Buy x get y free">Buy x get y free</option>
            <option value="Basket level offer - 100$ for 5">Basket level offer - 100$ for 5</option>
            <option value="Basket level offer - Product free">Basket level offer - Product free</option>
            <option value="Discount %">Discount %</option>
            <option value="Discount $">Discount $</option>
</select>    

<input type="text" required class="form-control" id="" placeholder="Enter Discount Value" ng-model="addOffer.value">

这是我的选择框（选择需要提供的报价类型）和文本字段（具有上述所选报价的设置值）。

当我选择购买x获得免费时，textfild应该只接受像X这样的值：Y和X应该大于Y（例如3：1），即两个整数之间的冒号。

对于其他选项，inputfiled应该只接受整数。如何使用angular js验证此文本框？

我猜指令应该做的伎俩！但我不知道如何实现这一目标。请帮助我。提前谢绝。

Answer 1

实际上，当选择相应的选项时，您可以使用一些使用不同验证的文本字段和ng-show。 IMO有一个切换验证的文本字段太麻烦了。

Answer 2

您在单输入框中有基于选项的切换验证，因此我们设置了一些约束，复选框应仅接受整数。在下面找到

在ng-pattern =＆＃34; / ^ [0-9] {1,7} $ /＆＃34;在输入字段中使用格式模式。

 <div ng-app ng-controller="formCtrl">
  <form name="myForm" ng-submit="onSubmit()">
    <input type="number" ng-model="price" name="price_field" 
           ng-pattern="/^[0-9]{1,7}$/" required>
    <span ng-show="myForm.price_field.$error.pattern">Not a valid number!</span>
    <span ng-show="myForm.price_field.$error.required">This field is required!</span>
    <input type="submit" value="submit"/>
  </form>
</div>

演示：http://jsfiddle.net/KGd8K/1172/

Angular js TextField验证

2 个答案: