AngularJS проверки входных данных
AngularJS формы и элементы управления могут проверять входные данные.
проверка ввода
В предыдущих разделах вы узнали знания о AngularJS форм и элементов управления.
AngularJS формы и элементы управления могут предложить функции проверки и незаконные данные, введенные пользователем предупреждение.
 | Убедитесь в том, что клиент не может обеспечить безопасность ввода пользовательских данных, сервер проверки данных также необходимо. |
|---|
код приложения
<! DOCTYPE HTML>
<HTML>
<Script SRC = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ скрипт>
<Body>
<H2> Validation Пример </ h2 >
<Форма нг-приложение = "MyApp " нг-контроллер = "validateCtrl"
имя = "MyForm" NOVALIDATE>
<P> Имя пользователя: <br>
<Тип входного = "текст" имя = нг-модель "пользователь" = "пользователь" требуется>
<Спан стиль = "цвет: красный " нг-шоу = ".. MyForm.user $ грязный && myForm.user $ недопустимый">
<SPAN нг-шоу = "myForm.user . $ Error.required"> имя пользователя необходимо. </ Span>
</ Span>
</ P>
<P> Электронная почта: <br>
<Тип = Введите имя "электронная почта" = "электронная почта" нг-модель = "электронная почта" требуется>
<Спан стиль = "цвет: красный " нг-шоу = ".. MyForm.email $ грязный && myForm.email $ недопустимый">
<SPAN нг-шоу = "myForm.email . $ Error.required"> почтовый ящик является обязательным. </ Span>
<SPAN нг-шоу = "myForm.email . $ Error.email"> незаконные почтовые ящики. </ Span>
</ Span>
</ P>
<P>
<Тип входного = "Отправить"
нг-инвалидов = "myForm.user. $ загрязнен && myForm.user. $ недействительны ||
myForm.email. $ загрязнен && myForm.email. $ недопустимый ">
</ P>
</ Форма>
<Script>
вар приложение = angular.module ( 'MYAPP', []);
app.controller ( 'validateCtrl', функция ($ сфера) {
$ Scope.user = 'John Doe';
$ Scope.email = '[email protected]';
});
</ Script>
</ Body>
</ HTML>
<HTML>
<Script SRC = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ скрипт>
<Body>
<H2> Validation Пример </ h2 >
<Форма нг-приложение = "MyApp " нг-контроллер = "validateCtrl"
имя = "MyForm" NOVALIDATE>
<P> Имя пользователя: <br>
<Тип входного = "текст" имя = нг-модель "пользователь" = "пользователь" требуется>
<Спан стиль = "цвет: красный " нг-шоу = ".. MyForm.user $ грязный && myForm.user $ недопустимый">
<SPAN нг-шоу = "myForm.user . $ Error.required"> имя пользователя необходимо. </ Span>
</ Span>
</ P>
<P> Электронная почта: <br>
<Тип = Введите имя "электронная почта" = "электронная почта" нг-модель = "электронная почта" требуется>
<Спан стиль = "цвет: красный " нг-шоу = ".. MyForm.email $ грязный && myForm.email $ недопустимый">
<SPAN нг-шоу = "myForm.email . $ Error.required"> почтовый ящик является обязательным. </ Span>
<SPAN нг-шоу = "myForm.email . $ Error.email"> незаконные почтовые ящики. </ Span>
</ Span>
</ P>
<P>
<Тип входного = "Отправить"
нг-инвалидов = "myForm.user. $ загрязнен && myForm.user. $ недействительны ||
myForm.email. $ загрязнен && myForm.email. $ недопустимый ">
</ P>
</ Форма>
<Script>
вар приложение = angular.module ( 'MYAPP', []);
app.controller ( 'validateCtrl', функция ($ сфера) {
$ Scope.user = 'John Doe';
$ Scope.email = '[email protected]';
});
</ Script>
</ Body>
</ HTML>
Попробуйте »
| HTML форма атрибутов NOVALIDATE для отключения проверки по умолчанию браузера. |
|---|
Примеры аналитических
AngularJS инструкция нг-модель используется для связывания входных элементов в модели.
Объект Модель имеет два атрибута: пользователя и адрес электронной почты.
Мы используем нг-шоу команды, цвет: красный в сообщении составляет всего лишь $ загрязнен или $ недействительны дисплей.
| свойство | описание |
|---|---|
| $ Грязный | Есть формы для заполнения записи |
| $ Действителен | Содержимое поля легитимной |
| $ Invalid | Содержимое поля являются незаконными |
| $ Пристин | Нет формы, чтобы заполнить запись |