自定义指令验证

时间:2014-09-06 18:40:23

标签: javascript angularjs

我有一个下拉列表作为自定义指令。我需要表单验证,所以我使用了这段代码:

autoQuoteApp.directive('dropdown', function () {
    return {
        restrict: 'E',
        scope: { 
        listData:'=',
        selectedOption: "="
        },
        template: '<select ng-model="selectedOption" name="drop" required ng-options="list.id as list.value for list in listData"></select>',
    };
});

html代码是:

<div class="input-align">
    <dropdown selected-option='driverInfo.primaryVehicle' list-data='primaryVehicles'></dropdown>
    <span class="error" ng-show="myForm.drop.$error.required">
        Required!   
    </span>
</div>

我面临的问题是我在一个页面中有多个下拉菜单,验证只适用于一个。

只要我为第一个选择了值,就会删除&#39;必需&#39; 文本,但我需要它才能为该特定下拉菜单选择值

1 个答案:

答案 0 :(得分:0)

对于您创建的每个指令,请保留一个单独的名称

喜欢&#34; drop1&#34;

<div class="input-align">
<dropdown name="drop1" selected-option='driverInfo.primaryVehicle' list-data='primaryVehicles'></dropdown>
<span class="error" ng-show="myForm.drop1.$error.required">
    Required!   
</span>

对于其他下拉列表,请保留不同的名称&#34; drop2&#34;

<div class="input-align">
<dropdown name="drop2" selected-option='driverInfo.primaryVehicle' list-data='primaryVehicles'></dropdown>
<span class="error" ng-show="myForm.drop2.$error.required">
    Required!   
</span>