【问题标题】:How to check the check boxes based on the values stored in db(Angularjs)如何根据存储在 db(Angularjs) 中的值检查复选框
【发布时间】:2023-03-28 11:58:01
【问题描述】:

我可以根据检查向 db 插入值,但我在从 db 获取时未能检查值..谁能给我一些帮助。谢谢。

我的模板,

<div class="btn-group col-xs-4 nopadding"  ng-repeat="type in vm.bussinesstypeoptions" data-toggle="buttons">
   <label class="col-xs-12 btn btn-white" ng-click="toggleSelection(type)" ng-class="{'active': type == checkvalue.name   }">
 <input type="checkbox" name="selectbox"  value="type" ng-checked="vm.selection.indexOf(checkvalue.name) > -1"   required> {{type}}
  </label>
</div>

我的值存储在数据库中,

"business_type" : [ 
    "Education Consultant", 
    "Guardianship", 
    "Hotel/Home-Stay"
],

【问题讨论】:

    标签: javascript html angularjs checkbox


    【解决方案1】:

    首先,在使用角度方式时,不要使用value,而是使用ng-model

    然后将ng-checked 设为ng-model 的值。

    ng-model="type" and ng-checked="type"

    这里是解决的sn-p:

    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
    
    $scope.bussinesstypeoptions = ['Education Consultant', 'Ticket/Travel', 'Hotel/Home-Stay', 'Guardianship', 'Visa/Solicitors', 'Others']; 
    
    $scope.object = {}
    $scope.business_type = [ 
        "Education Consultant", 
        "Guardianship", 
        "Hotel/Home-Stay"
    ]
    
    
    for(i = 0;i < $scope.business_type.length; i++)
    {
    
    $scope.object[$scope.business_type[i]] = true;
     console.log($scope.object)
      
    }
    });
    <!DOCTYPE html>
    <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <body>
    
    <div ng-app="myApp" ng-controller="myCtrl">
    
    <div class="btn-group col-xs-4 nopadding"  ng-repeat="type in bussinesstypeoptions" data-toggle="buttons">
       <label class="col-xs-12 btn btn-white" ng-click="toggleSelection(type)" ng-class="{'active': object.type}">
     <input type="checkbox" name="selectbox" ng-checked="object[type]" required ng-model="type"> {{type}}
      </label>
    </div>
    
    </div>
    
    </body>
    </html>

    Here is a fiddle of it

    【讨论】:

    • @nlr_p,检查了吗?
    • Ya Sravan,但无论我的数据库值如何,我都会检查所有复选框。
    • vm.bussinesstypeoptions 中有什么
    • vm.bussinesstypeoptions = ['教育顾问', '机票/旅行', '酒店/家庭住宿', '监护权', '签证/律师', '其他'];
    • 现在请检查我的答案。
    猜你喜欢
    • 2011-10-19
    • 2012-01-09
    • 2021-08-23
    • 1970-01-01
    • 1970-01-01
    • 2017-07-11
    • 2015-12-12
    • 2020-08-23
    • 1970-01-01
    相关资源
    最近更新 更多