成都网站建设设计

将想法与焦点和您一起共享

如何在ng-repeat中利用Checkbox实现一个默认选中功能-创新互联

如何在ng-repeat中利用Checkbox实现一个默认选中功能?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

成都创新互联始终坚持【策划先行,效果至上】的经营理念,通过多达10余年累计超上千家客户的网站建设总结了一套系统有效的营销解决方案,现已广泛运用于各行各业的客户,其中包括:成都砂岩浮雕等企业,备受客户赞美。

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

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

在ASP.NET MVC程序中的Entity,准备一些数据:

public IEnumerable Cars()
    {
      return new List()
      {
        {new Car() { ID = 1, Name = "玛莎拉蒂",Selected=false }},
        {new Car() { ID = 2, Name = "奔驰" ,Selected=false }},
        {new Car() { ID = 3, Name = "宝马" ,Selected=true }},
        {new Car() { ID = 4, Name = "保时捷",Selected=false }}
      };
    }

在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();
    }

Html程序:



  
    
      {{c.Name}}     
       

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;
    });
    
  });

看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注创新互联行业资讯频道,感谢您对创新互联网站建设公司,的支持。


网页题目:如何在ng-repeat中利用Checkbox实现一个默认选中功能-创新互联
地址分享:http://chengdu.cdxwcx.cn/article/dgegde.html

其他资讯