<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            .my-form{

                transition: all linear 0.5s;

                background: transparent;

            }

            .my-form.ng-invalid{

                background-color: red;

            }

        </style>

    </head>

    <body ng-app="app">

        <form name="myForm"  class="my-form">

            userType: <input type="text" name="input" ng-model="userType" required="required"/><br />

            <span class="error" ng-show="myForm.input.$error.required">Required!</span><br />

            <code>userType:{{userType}}</code><br />

            <code>$valid:{{myForm.input.$valid}}</code><br />

            <code>$error:{{myForm.input.$error}}</code><br />

            <code>myForm.$valid: {{myForm.$valid}}</code><br />

            <code>myForm.$error.required:{{myForm.$error.required}}</code>

        </form>

        <script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">

            angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="'+window.location.pathname+'"/>'));

        </script>

        <script type="text/javascript">

            var app = angular.module('app' , []);

                /*app.controller('formController' , ['$scope' , function($scope){

                    $scope.userType = 'gest';

                }])*/

        </script>

    </body>

</html>

angular.js form的更多相关文章

  1. 使用angular.js获取form表单中的信息

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Angular.js通过bootstrap实现经典的表单提交

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel= ...

  3. Angular JS 学习之Bootstrap

    1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...

  4. Angular.js表单以及与Bootatrap的使用

    首先从angular.js的目录开始,如下图,知道了我们要学什么,然后再开始有目的的学习与对比. 1.从表达式开始: ng-app指令初始化一个 AngularJS 应用程序. ng-init指令初始 ...

  5. Angular.js 学习笔记

    AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...

  6. activiti自定义流程之整合（二）：使用angular js整合ueditor创建表单

    注:整体环境搭建:activiti自定义流程之整合(一):整体环境配置 基础环境搭建完毕,接下来就该正式着手代码编写了,在说代码之前,我觉得有必要先说明一下activit自定义流程的操作. 抛开自定义 ...

  7. angular js 表单验证

    <!doctype html> <html ng-app="myapp"> <head> <meta charset="UTF- ...

  8. socket.io+angular.js+express.js做个聊天应用(四)

    接着上一篇 使用angularjs构建聊天室的client <!doctype html> <html ng-app="justChatting"> < ...

  9. {{angular.js 使用技巧}} - 基于验证框架的扩展（w5cValidator）

    开场白: angular.js 是谷歌出的前端js MV*框架,我也是今年做 worktile 的时候才开始接触的,起初技术选型的时候还准备使用 backbone(毕竟很多大公司在使用他,而且也是比较 ...

随机推荐

  1. timus 1136 Parliament(e)

    Parliament Time limit: 1.0 secondMemory limit: 64 MB A new parliament is elected in the state of MMM ...

  2. hdu5443（2015长春赛区网络赛1007）暴力

    题意:给了一个数列,有多个询问,每个询问求某个区间内的最大值 数列长度 1000,询问个数 1000,静态,并不需要RMQ这些,直接暴力 n2 查找每个询问区间取最大值就行了. #include< ...

  3. 控制文本和外观------Style Binding(Style属性绑定)

    目的 style绑定是添加或删除一个或多个DOM元素上的style值.比如当数字变成负数时高亮显示,或者根据数字显示对应宽度的Bar.(注:如果你不是应用style值而是应用CSS class的话,请 ...

  4. Android Studio 常用快捷键以及设置

    常用快捷键: Ctrl+Q 出现文档提示 跟ecplise的 鼠标悬浮差不多 Ctrl+Alt+t 包围代码 Home End 移动光标到文本首和文本尾 Alt+回车 导入当前包 Ctrl+Alt+O ...

  5. 强化学习之 免模型学习（model-free based learning）

    强化学习之 免模型学习(model-free based learning) ------ 蒙特卡罗强化学习 与 时序查分学习 ------ 部分节选自周志华老师的教材<机器学习> 由于现 ...

  6. stl迭代器原理

    具体实现肯定不如书上讲的清楚了,这里只是根据侯捷书上的讲解,自己建立一条思路以及形成一些相关的概念 迭代器也可被称作智能指针,用于遍历容器内的元素,stl每个容器都实现了自己的iterator,ite ...

  7. Linux-Memcache分布式部署方案（magent代理解决单点故障）

    Memcached的特点 Memcached作为高速运行的分布式缓存服务器具有以下特点. 1. 协议简单:memcached的服务器客户端通信并不使用复杂的MXL等格式, 而是使用简单的基于文本的协议 ...

  8. DBN（深度信念网络）

    DBN运用CD算法逐层进行训练,得到每一层的参数Wi和ci用于初始化DBN,之后再用监督学习算法对参数进行微调.本例中采用softmax分类器(下一篇随笔中)作为监督学习算法. RBM与上一篇随笔中一 ...

  9. javascript error

    IE 6下expected identifier,string or number(缺少标示符.字符串或数字)其实就是多了一个逗号,之前没发现

  10. 谷歌 analytics.js 简要分析

    下面是部分翻译过的JS,看起来好看些.   (function () { function setHref(a, b) { return a.href = b; } function setName( ...