zoukankan      html  css  js  c++  java
  • AngulairJS表单输入验证与mvc

    AngulairJS表单输入验证

    1.表单中,常用的验证操作有:$dirty 表单有填写记录、$valid 字段内容合法的、$invalid 字段内容是非法的、$pristine 表单没有填写记录、$error    表单验证不通过的错误验证信息.

    2.验证时,需给表单及需要验证的input设置name属性

    给form和input设置name后,会将form表单信息,默认绑定到$scope作用域中。故,可以使用formName.inputname.$验证操作得到验证结果

    例如:formName.inputName.$dirty="true"表单被填过

           formName.inputName.$valid="true"表单输入不合法

           formName.inputName.$error.required="true"表单必填但未填

           $error支持的验证required/minlength/maxlength/pattern/email/number/date/url等

    3.为避免冲突,例如使用type="email"  时,H5也会进行验证操作。如果只想使用AngulaiJS验证,3.为避免冲突,例如使用type="email"  s时,H5也会进行验证操作。如果只想使用AngulaiJS验证。

      总体流程是,先布局,再给input设置name等属性,在提示位置加入ng-show等属性达到想要的效果。

    AngularJS中的mvc

    model(模型):应用程序中用于处理数据的部分。(保存或修改数据到数据库的,变量等)。AngularJS中的model特指的是数据:数据
    view(视图):用户看到的用于显示数据的页面

    工作原理:用户从视图层发出请求,controller接收到请求后转发给model处理,model处理完后返回后给controller,并在view层
    反馈给用户。

    具体流程是:

    创建一个angular模块,即ng-app所绑定部分,需传递两个参数:

    ①模块名称,即ng-app所需要绑定的名称。ng-app="myapp"

    ②数组:需要注入的模块名称,不要可为空

    在angular模块上,创建一个控制器controller,需要传递两个参数
    ①controller名称即ng-controller所需要绑定的名称。ng-controller="mycontroller"
    ②controller的构造函数。构造函数可以传入多个参数,包括$scope/$rootScope以及各种系统内置对象;


     [AngularJS中的作用域]
    ①$scope:局部作用域,声明在$scope上的属性和方法只能在当前controller中使用;
    ②$rootScope:根作用域,声明在$rootscope上的属性和方法可以在ng-app所包含的任何部分使用(无论是否同一个cntroller或是否在
    controller包含范围中
    若没有使用$scope声明变量而直接在html中使用ng-model变量的作用域为
    1如果ng-model在某个ng-controller中则此变量会默认绑定到大跟前controller 的$sope上
    2.如果bg-model没有任何一个ng-controller中,则此变量绑定在$rootscope上;


  • 相关阅读:
    Java 面试 --- 3
    Java 面试-- 1
    面试之痛 -- 二叉树 前序 中序 后序
    java 事务
    深入理解mybatis
    hibernate
    mybatis 原理
    spring 原理
    spring aop
    spring 事务
  • 原文地址:https://www.cnblogs.com/jyc226/p/6820612.html
Copyright © 2011-2022 走看看