每当我点击AngularJS中的按钮时,验证空文本字段

时间:2017-09-28 07:45:10

标签: javascript jquery angularjs validation

我编写了在AngularJS中动态添加和删除输入文本字段的代码。这是我的代码:

我的HTML

<div class="form-group">
    <label for="hobbies">Hobbies</label>
    <span ng-repeat="hobby in hobbies track by $index">
        <div class="form-group">
            <input type='text' ng-model='hobbies[$index]' class="form-control pull-right"/>
            <button ng-click = "addHobby()" ng-show="$last">+</button>
            <button ng-click = "removeHobby($index)" ng-show="hobbies.length > 1">-</button>
        </div>
    </span>
</div>

角度控制器

$scope.hobbies = [''];

$scope.addHobby = function() {
    $scope.hobbies.push('');
}

$scope.removeHobby = function(index) {
    if(index >= 0){
        $scope.hobbies.splice(index, 1);
    }
}

在此,如何点击+按钮验证空文本字段?

1 个答案:

答案 0 :(得分:1)

addhobby功能更改为可以验证空文本字段的内容,例如:

$scope.addHobby = function($index) {
    if($scope.hobbies[$index])
        $scope.hobbies.push('');
}

和你的html按钮:

<button ng-click = "addHobby($index)" ng-show="$last">+</button>

这样,只要你当前的输入文字字段不是空的,你的addHobby函数就会增加一个爱好。