angularJs form

form.name.$valid 유효성 여부
form.name.$무효 여부
form.name.$error 오류 집합
　　form.name.$error.required
　　form.name.$error.email
submit 단추가ng-disabled="form.$invalid를 사용하지 않도록 설정할지 여부를 조정합니다

다음은 사용자 이름의 유일한 간단한 쓰기 여부를 검증하는 것입니다.

<!DOCTYPE html>

<html>
<head>
    <title></title>
    <script src="angular.min.js" type="text/javascript"></script>
</head>
<body ng-app="formTest" ng-controller="formController">
    <form name="myForm" ng-submit="show()">
        <input name="personName" required ng-model="person.name" ensure-Unique="personName"/>
        <span></span>
        <input type="submit" ng-disabled="myForm.$invalid"/>
    </form>
    <script>
        var formTest = angular.module("formTest", []);
        formTest.controller("formController", function ($scope) {
            $scope.person = {
                email: "",
                name: "Jackey"
            };
            $scope.show = function () {
                //alert($scope.person.name);
                console.log(myForm.personName.$error)
            };
        }).directive("ensureUnique", function ($http) {
            return {
                require: "ngModel",
                link: function (scope, element, attrs) {
                    scope.$watch(attrs.ngModel, function () {
　　　　　　　　　　　　　　//$http.....
                        console.log(scope.person.name);
                        element.next("span").text(scope.person.name);// 
                    });

                }
            };
        });
    </script>
</body>
</html>

다시 수정할게요.

<!DOCTYPE html>

<html>
<head>
    <title></title>
    <script src="angular.min.js" type="text/javascript"></script>
</head>
<body ng-app="formTest" ng-controller="formController">
    <form name="myForm" ng-submit="show()">
        <input name="personName" required ng-model="person.name" ensure-Unique="personName"/>
        <span></span>
        <input type="submit" ng-disabled="myForm.$invalid"/>
    </form>
    <script>
        var formTest = angular.module("formTest", []);
        formTest.controller("formController", function ($scope) {
            $scope.person = {
                email: "",
                name: ""
            };
            $scope.show = function () {
                //alert($scope.person.name);
                console.log(myForm.personName.$error)
            };
        }).directive("ensureUnique", function () {
            return {
                require: "ngModel",
                link: function (scope, element, attrs) {
                    scope.$watch(attrs.ngModel, function (n) {
                        if (!n) return;
                        console.log(n);
                        element.next("span").text(scope.person.name); // 
                    });

                }
            };
        });
    </script>
</body>
</html>

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

AngularJS의 ng-options best practise

쓸데없는 말은 하지 말고 바로 코드를 찍어라. 리소스를api에 직접 전달하지 말고 문자열이나 정형(예를 들어 귀속된ng-model="selected")을 권장합니다 angular에서 생성된 의value가 무엇인지, ...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

angularJs form

좋은 웹페이지 즐겨찾기