在ng-repeat内Checkbox默认选中

时间:2022-02-01 08:45:35

Angularjs的ng-repeat是用来循环产生呈现数据。

当我们需要在ng-repeat循环中呈现一系列Checkbox时,某些checkbox选项是默认选中的。

在ASP.NET MVC程序中的Entity,准备一些数据:
在ng-repeat内Checkbox默认选中

 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准备一个呼叫的方法:
在ng-repeat内Checkbox默认选中

 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:
在ng-repeat内Checkbox默认选中

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默认选中

在ng-repeat内Checkbox默认选中的更多相关文章

  1. jQuery设置 select、radio、checkbox 默认选中的值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 关于在layui中的table checkbox 默认选中设置

    一.layui版本 layui-v2.4.5 二.设置table的checkbox默认选中 总共有两种方法: 方法1:在返回的json中设置LAY_CHECKED为true,页面上的checkbox就 ...

  3. jsTree的checkbox默认选中和隐藏

    jstree复选框自定义显示隐藏和初始化默认选中 首先需要配置 Checkbox plugin "plugins" : ['checkbox'] 设置默认选中状态(checkbox ...

  4. checkbox默认选中

    http://www.ggfenxiang8.com/?page_id=1108 需要最新前端视频教程vu.js1.0/2.0等的可以叫我QQ1139721002

  5. ligerUI---ligerGrid默认选中checkbox

    写在前面: ligerGrid中是可以带有checkbox(前面有可以选择打勾勾的框框)的,对于checkbox默认选中 这次项目中也要做,因为一个系统的增删改查,在修改一条数据的时候,是需要对原来的 ...

  6. jquert 判断checkbox 是否选中

    <input type="checkbox" id="IsEnable" /> 在调试的时候,会出现,一直未true的状态,不管是选中还是未选中 解 ...

  7. JS 判断checkbox 是否选中

    <input type="checkbox" id="IsEnable" /> 在调试的时候,会出现,一直未true的状态,不管是选中还是未选中 解 ...

  8. freemarker中修改和添加功能中包含checkbox复选框默认选中需求的解决方式

    今天做的公司ERP系统上线第一天内部使用的,各种BUG铺天盖地,[虽然只是技术总监一个人在测试……],其中有一个就是其中部门管理页面中的修改和添加功能 一个人做一套ERP总是有点疏漏的,虽然里面的东西 ...

  9. Dtree 添加 checkbox 复选框 可以默认选中

    一:目标 要实现用一个树形结构的展示数据,每个节点(除了根节点)前有一个checkbox,同时,点击父节点,则子节点全选或者全不选,当选中了全部子节点,父节点选中:如下图所示: 同时可以在创建的时候, ...

随机推荐

  1. AngularJS过滤器

    1.过滤器可以使用一个管道字符(|)添加到表达式和指令中. 再次强调一点,所有的运行都要加入angularJS的库文件(类似JQuery的引用) 常见的AngularJS 过滤器 (1) lowerc ...

  2. Linux mint 18版本开启SSH服务

    linux mint 18版本默认是没有安装ssh server的 需要手动安装 安装ssh server: 此命令需要联网,会自动下载安装 安装之后看是否开始了ssh, 看到ssh-agent 和s ...

  3. &lt&semi;s&colon;iterator&gt&semi;各种遍历用法

    struts2<S:iterator>遍历map小结 1.MapAction.java import java.util.ArrayList;   import java.util.Has ...

  4. jQuery动态添加的元素中处理字符串溢出后在指定字符数后添加省略号

    "+[jsonData[i].questitle.lenth>40?jsonData[i].questitle.substring(0,40)+"...":json ...

  5. Database name和SID

    http://docs.oracle.com/cd/B19306_01/install.102/b15667/rev_precon_db.htm#i1027493 The Oracle Databas ...

  6. jsp页面遍历List&lt&semi;Array&gt&semi;

    不难的遍历,难住了“前辈”,因此决定分享一下希望帮助那些还迷糊的人. 数据结构下如图所示,之前的前辈遍历方法如下,厉害哦!当然,代码直接抛异常哈, <c:if test="${!emp ...

  7. hdu 5430&lpar;几何&rpar;

    题意:求光在圆内反射n次后第一次返回原点的方案数 如果k和n-1可约分,则表明是循环多次反射方案才返回原点. #include <iostream> #include <cstrin ...

  8. div和span标签

    ------------------------ ------------------------ ------------------------ 块级标签独占一行,不和别的标签在同一行显示:行内标 ...

  9. C&num; winform截图、web Cropper图片剪切、上传

    今天又来一弹,写了个小功能,windows 桌面截图,web剪切图片上传的功能. 废话不多说,直接上图: 1.winform 截屏功能 图1 主窗体 点击全屏截图,就已经全屏截图了,截图后,图片保存在 ...

  10. Windows下配置Git服务器和客户端

    http://www.cnblogs.com/lwme/archive/2012/12/25/configuring-git-server-and-client-on-windows.html] 选择 ...