1、对于文本框,只需设置 ng-model 属性就可以实现双向绑定,如:

<input type="text" class="form-control" ng-model="item">

这样在js中就可以通过  $scope.item来实现双向绑定。

2、单选按钮组的绑定方式,如:

<label>  <input type="radio" name="optionsRadios" value="single" ng-model="seltype" >单选题</label>
<label>  <input type="radio" name="optionsRadios" value="muti" ng-model="seltype">多选题</label>

在js中的代码:

1)初始化设置被选中的按钮: $scope.seltype = "muti"  这样初始时第2个radio就会被选中

2)获取被选中的按钮

如果 $scope.seltype 的值为 single ,则是第1个radio被选中。

如果 $scope.seltype 的值为 muti,则是第2个radio被选中。

3、复选框checkbox的绑定方式

<input type="checkbox"  ng-model="selok">选中

在js中的代码

1)初始化选中:$scope.selok = true;

2)判断checkbox是否被选中:

如果 $scope.selok 返回true,则被选中;否则没有被选中

Angulajs 表单的ng-model绑定的更多相关文章

  1. spring+thymeleaf实现表单验证数据双向绑定

    前言 这个教程介绍了Thymeleaf与Spring框架的集成,特别是SpringMvc框架. 注意Thymeleaf支持同Spring框架的3.和4.版本的集成,但是这两个版本的支持是封装在thym ...

  2. python_way day17 jQuery表单验证,事件绑定,插件,文本框架,正则表达式

    python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...

  3. 避免layui form表单重复触发submit绑定事件

    个人博客 地址:http://www.wenhaofan.com/article/20180927002336 在使用以下代码监听lay-filter为editConfig的提交按钮后,当点击提交按钮 ...

  4. knockoutJS学习笔记08:表单域绑定

    前面的绑定都是用在基本标签上,这章主要讲表单域标签的绑定. 一.value 绑定 绑定标签:input text.textarea. <p>用户名:<input type=" ...

  5. 第二章 Vue快速入门--13 讲解v-model实现表单元素的数据双向绑定

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

  6. html表单-双向绑定

    潜水多年.一直是只看不评不写多年,每每看到各位大牛分享的经典文章都是默默的收藏,对大牛技术分享技术表示感谢,这么多年从博客园学到了很多. 这段时间项目告一段落. 正好这段时间相对清闲,我也整理一些常用 ...

  7. antd 表单双向绑定的研究

    痛点 在使用antd的表单时,大家觉得不够清爽,总结如下: 大量的模板语法,需要一定的学习成本. 需要手动地进行数据绑定,使用大量的onChange/setFieldsValue去控制数据. 无法通过 ...

  8. 走进AngularJs 表单及表单验证

    年底了越来越懒散,AngularJs的学习落了一段时间,博客最近也没更新.惭愧~前段时间有试了一下用yeoman构建Angular项目,感觉学的差不多了想做个项目练练手,谁知遇到了一系列问题.yeom ...

  9. 走进AngularJs(九)表单及表单验证

    年底了越来越懒散,AngularJs的学习落了一段时间,博客最近也没更新.惭愧~前段时间有试了一下用yeoman构建Angular项目,感觉学的差不多了想做个项目练练手,谁知遇到了一系列问题.yeom ...

随机推荐

  1. SQL学习之组合查询(UNION)

    1.大多数的SQL查询只包含从一个或多个表中返回数据的单条SELECT语句,但是,SQL也允许执行多个查询(多条SELECT语句),并将结果作为一个查询结果集返回.这些组合查询通常称为并或复合查询. ...

  2. mywebsite1

    http://www.wuweierwei.com/ 个人网站 http://www.yyyweb.com/demo/icons-filling/index.html CSS3图标填充效果 http: ...

  3. ASP.Net中使用Report Service

    昨天研究以下Report Service,发现SQL Service自带的报表服务器也非常强大, 一,报表在不同的应用中表现形式 参考:http://www.cnitblog.com/yide/arc ...

  4. Asp.Net MVC 控制器

    原文链接:http://www.asp.net/learn/mvc/ 这篇教程探索了ASP.NET MVC控制器(controller).控制器动作(controller action)和动作结果(a ...

  5. C# 后台调用前台JS

    1.需要添加微软的类库  Interop.MSScriptControl.dll 2. var path = Path.GetFullPath("../../javascript/youzi ...

  6. [转] jQuery 操作 JSON 数据

    jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...

  7. ;(function( $, window, undefined ){ }(jQuery,window))为何需要往里面传$,window,undefined这些参数

    (function( $, jQuery , undefined ) {})(jQuery); 为什么要将window和undefined作为参数传给它? 因为 ecmascript 执行JS代码是从 ...

  8. css如此强大你知道吗

    看个这个大神纯 CSS 绘制<辛普森一家>人物头像我惊呆了,css如此牛x <div id="wrap"> <div class="cont ...

  9. Mad Lib程序

    单选框  复选框  按钮  标签  文本框的应用 #coding=utf-8 __author__ = 'minmin' from Tkinter import * class Application ...

  10. Codeforces Round#1

    A. Theatre Square 题目大意:有一个长宽为m和n的广场,用边长为a的正方形去铺盖,问铺满最少需要多少正方形 题解:题目分解为用长度为a的线条分别去覆盖长度为m和n的线条,计算两者的乘积 ...