Angularjs的ng-repeat是用来循环产生呈现数据。
当我们需要在ng-repeat循环中呈现一系列Checkbox时,某些checkbox选项是默认选中的。
在ASP.NET MVC程序中的Entity,准备一些数据:
public IEnumerable<Car> Cars()
{
return new List<Car>()
{
{new Car() { ID = , Name = "玛莎拉蒂",Selected=false }},
{new Car() { ID = , Name = "奔驰" ,Selected=false }},
{new Car() { ID = , Name = "宝马" ,Selected=true }},
{new Car() { ID = , Name = "保时捷",Selected=false }}
};
}
Source Code
在ASP.NET MVC的控制器中,准备一个方法。这个方法是读取Entity的数据,并为angularjs准备一个呼叫的方法:
public JsonResult GetCars()
{
CarEntity ce = new CarEntity();
var model = ce.Cars();
return Json(model, JsonRequestBehavior.AllowGet);
} public ActionResult CheckBox_IsChecked()
{
return View();
}
Source Code
OK,下面我们开始我们真正的程序angularjs:
Html程序:
<div ng-app="PilotApp" ng-controller="CarCtrl">
<div ng-repeat="c in Cars">
<div>
<input type="checkbox" value="{{c.ID}}" ng-checked="{{c.Selected}}" />{{c.Name}}
</div> </div>
</div>
Source Code
Angularjs程序:
var pilotApp = angular.module("PilotApp", []); pilotApp.controller('CarCtrl', function ($scope, $http) {
var obj = {}; $http({
method: 'POST',
url: '/Car/GetCars',
dataType: 'json',
headers: {
'Content-Type': 'application/json; charset=utf-8'
},
data: JSON.stringify(obj),
}).then(function (response) {
$scope.Cars = response.data;
}); });
Source Code
程序运行最终呈现的效果:
在ng-repeat内Checkbox默认选中的更多相关文章
-
jQuery设置 select、radio、checkbox 默认选中的值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
-
关于在layui中的table checkbox 默认选中设置
一.layui版本 layui-v2.4.5 二.设置table的checkbox默认选中 总共有两种方法: 方法1:在返回的json中设置LAY_CHECKED为true,页面上的checkbox就 ...
-
jsTree的checkbox默认选中和隐藏
jstree复选框自定义显示隐藏和初始化默认选中 首先需要配置 Checkbox plugin "plugins" : ['checkbox'] 设置默认选中状态(checkbox ...
-
checkbox默认选中
http://www.ggfenxiang8.com/?page_id=1108 需要最新前端视频教程vu.js1.0/2.0等的可以叫我QQ1139721002
-
ligerUI---ligerGrid默认选中checkbox
写在前面: ligerGrid中是可以带有checkbox(前面有可以选择打勾勾的框框)的,对于checkbox默认选中 这次项目中也要做,因为一个系统的增删改查,在修改一条数据的时候,是需要对原来的 ...
-
jquert 判断checkbox 是否选中
<input type="checkbox" id="IsEnable" /> 在调试的时候,会出现,一直未true的状态,不管是选中还是未选中 解 ...
-
JS 判断checkbox 是否选中
<input type="checkbox" id="IsEnable" /> 在调试的时候,会出现,一直未true的状态,不管是选中还是未选中 解 ...
-
freemarker中修改和添加功能中包含checkbox复选框默认选中需求的解决方式
今天做的公司ERP系统上线第一天内部使用的,各种BUG铺天盖地,[虽然只是技术总监一个人在测试……],其中有一个就是其中部门管理页面中的修改和添加功能 一个人做一套ERP总是有点疏漏的,虽然里面的东西 ...
-
Dtree 添加 checkbox 复选框 可以默认选中
一:目标 要实现用一个树形结构的展示数据,每个节点(除了根节点)前有一个checkbox,同时,点击父节点,则子节点全选或者全不选,当选中了全部子节点,父节点选中:如下图所示: 同时可以在创建的时候, ...
随机推荐
-
AngularJS过滤器
1.过滤器可以使用一个管道字符(|)添加到表达式和指令中. 再次强调一点,所有的运行都要加入angularJS的库文件(类似JQuery的引用) 常见的AngularJS 过滤器 (1) lowerc ...
-
Linux mint 18版本开启SSH服务
linux mint 18版本默认是没有安装ssh server的 需要手动安装 安装ssh server: 此命令需要联网,会自动下载安装 安装之后看是否开始了ssh, 看到ssh-agent 和s ...
-
<;s:iterator>;各种遍历用法
struts2<S:iterator>遍历map小结 1.MapAction.java import java.util.ArrayList; import java.util.Has ...
-
jQuery动态添加的元素中处理字符串溢出后在指定字符数后添加省略号
"+[jsonData[i].questitle.lenth>40?jsonData[i].questitle.substring(0,40)+"...":json ...
-
Database name和SID
http://docs.oracle.com/cd/B19306_01/install.102/b15667/rev_precon_db.htm#i1027493 The Oracle Databas ...
-
jsp页面遍历List<;Array>;
不难的遍历,难住了“前辈”,因此决定分享一下希望帮助那些还迷糊的人. 数据结构下如图所示,之前的前辈遍历方法如下,厉害哦!当然,代码直接抛异常哈, <c:if test="${!emp ...
-
hdu 5430(几何)
题意:求光在圆内反射n次后第一次返回原点的方案数 如果k和n-1可约分,则表明是循环多次反射方案才返回原点. #include <iostream> #include <cstrin ...
-
div和span标签
------------------------ ------------------------ ------------------------ 块级标签独占一行,不和别的标签在同一行显示:行内标 ...
-
C# winform截图、web Cropper图片剪切、上传
今天又来一弹,写了个小功能,windows 桌面截图,web剪切图片上传的功能. 废话不多说,直接上图: 1.winform 截屏功能 图1 主窗体 点击全屏截图,就已经全屏截图了,截图后,图片保存在 ...
-
Windows下配置Git服务器和客户端
http://www.cnblogs.com/lwme/archive/2012/12/25/configuring-git-server-and-client-on-windows.html] 选择 ...