小编Dan*_*kay的帖子

具有隔离范围的AngularJS表单验证

我想使用AngularJS提供的内置表单验证.但是,在表单中我使用自定义指令,每个指令都有一个隔离范围.因此,表单元素无法访问绑定值.

知道如何解决这个问题吗?

或者,是否可以在不使用表单的情况下使用AngularJS验证?

ng-minlength和ng-required指令不会触发表单验证.

<div ng-app="myApp" ng-controller="myCtrl">
    <form name="myForm" novalidate>
        <do-something ng-model="variable"></do-something>
        <h4 data-ng-if="myForm.myElement.$error.required">Please enter something</h4>
        <h4 data-ng-if="myForm.myElement.$error.greaterThanOne">Please enter a value greater than 1</h4>
        <h4 data-ng-if="myForm.myElement.$error.minLength">Please enter something longer than 1 digit</h4>
    {{myForm.myElement.$error}}     
    </form>
</div>

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
});
app.directive('doSomething', function () {
    return {
        restrict: 'E',
        require: '?ngModel',
        scope: {
            model: '=ngModel'
        },
        template: 
            '<div>' +
            '  <input name="myElement" ng-model="model" ng-required ng-minlength="1" />' +
            '</div>'
    }
});
Run Code Online (Sandbox Code Playgroud)

Full Plunk可以在这里找到:这是一个演示问题的plunkr:http://plnkr.co/edit/iWyvX2?p = preview

javascript forms validation angularjs

6
推荐指数
1
解决办法
4669
查看次数

标签 统计

angularjs ×1

forms ×1

javascript ×1

validation ×1