AngularJS验证引导状态选择器

时间:2017-01-26 07:44:07

标签: angularjs twitter-bootstrap laravel validation

我正在使用bootstrap country state picker但我无法使用AngularJS验证它是否有任何可能的解决方案?

1 个答案:

答案 0 :(得分:0)

您可以添加指令作为自定义验证

app.directive('state', function() {
  var states = [
    "Sweden",
    "England",
    "Denmark"
  ]

  return {
    require: 'ngModel',
    link: function(scope, elm, attrs, ctrl) {
      ctrl.$validators.state = function(modelValue, viewValue) {
        if (ctrl.$isEmpty(modelValue))
            return false;

        if (jQuery.inArray(viewValue, states) > -1)
            return true;

        return false;
        }
    }
  };
});

示例Html

<form name="form" novalidate>
    <select state ng-model="states" class="form-control">
        <option>Sweden</option>
        <option>England</option>
        <option>Denmark</option>
    </select>
    <span ng-show="form.states.$error.state">Not a state</span>
</form>

查看Angular的文档以获取更多信息 https://docs.angularjs.org/guide/forms

请记住,验证对您的BE 更重要,在这种情况下可能并不难。干杯!