javascript 如何使用 AngularJS 在数据库中的复选框中设置默认值

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/34333733/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 17:34:39  来源:igfitidea点击:

How to set default value checked in a checkbox from database using AngularJS

javascriptphpangularjs

提问by usman ahmad

While editing the record the data comes in their respective fields for editing, but the checkbox is not checked if its value is 1.

在编辑记录时,数据进入各自的编辑字段,但如果其值为 ,则不会选中复选框1

It should be in checked state if it has 1and not checked if it has 0as the datatype of the field is tinyint. I am retrieving the data from JSON array via PHP. I am trying to get value by ng-checked="{{rec.isSpecial}}"but it is not working.

如果字段的数据类型为 ,则它应该处于选中状态,如果它具有1则不检查。我正在通过 PHP 从 JSON 数组中检索数据。我正在尝试获取价值,但它不起作用。0tinyintng-checked="{{rec.isSpecial}}"

Here is my HTML:

这是我的 HTML:

<div class="form-group">
  <div class="col-lg-offset-2 col-lg-10">
    <div class="checkbox c-checkbox">
      <label>
        <input type="checkbox" ng-checked="{{rec.isSpecial}}" ng-model="rec.isSpecial">
        <span class="fa fa-check"></span>Special
      </label>
    </div>
  </div>
</div>

here is my JS

这是我的 JS

$scope.rec = $resource('api/AdminArea/category/edit/:id', {
  id: id
}).get(function(data) {
  $scope.rec = data;
});

回答by Jax

Since your data returns numbers and not true or false values you could do like so:

由于您的数据返回数字而不是 true 或 false 值,您可以这样做:

<div class="form-group">
    <div class="col-lg-offset-2 col-lg-10">
      <div class="checkbox c-checkbox">
        <label>
          <input type="checkbox" ng-checked="rec.isSpecial==1" ng-model="rec.isSpecial">
          <span class="fa fa-check"></span>Special
        </label>
      </div>
    </div>
  </div>

see fiddlefor more info

有关更多信息,请参阅小提琴

回答by Shashank Agrawal

You don't need ng-checkedat all, ng-modelis enough for it to work. If your rec.isSpecialis set to 1for it to be checked then just your inputlike this:

你根本不需要ng-checkedng-model足以让它工作。如果您rec.isSpecial设置1为要检查它,那么input就像这样:

<input type="checkbox" ng-model="rec.isSpecial" ng-value="1" />

and the Angular will automatically check that checkbox.

Angular 将自动检查该复选框。

回答by cdslijngard

The expression ng-checked={{ ... }}expects a trueor falsestatement. If you would set rec.isSpecial = true, in your Angular controller, your code should work!

该表达式ng-checked={{ ... }}需要一个trueorfalse语句。如果您rec.isSpecial = true在 Angular 控制器中设置 , 您的代码应该可以工作!

回答by Suresh B

'use strict';
var app = angular.module('MyApp',[]); 
app.controller('myController', function ($scope) {
   $scope.isSpecial =true;
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="form-group" ng-app ="MyApp" ng-controller="myController">
                              <div class="col-lg-offset-2 col-lg-10">
                                 <div class="checkbox c-checkbox">
                                    <label>
                       <input type="checkbox" ng-checked="{{isSpecial}}" ng-model="isSpecial">
                                       <span class="fa fa-check"></span>Special
                                      </label>
                                 </div>
                              </div>
                           </div>

回答by Renan Ferreira

You don't really need the directive ng-checkedif you are using ng-modelin the tag input.

ng-checked如果您ng-model在标签输入中使用,则您实际上并不需要该指令。

Since it is a checkbox, the model will be a boolean, so you need to make a cast. This example will work

由于它是一个复选框,模型将是一个布尔值,因此您需要进行转换。这个例子会起作用

HTML

HTML

<div data-ng-app="app">

  <div data-ng-controller="MainController">
    Check
    <input type="checkbox" data-ng-model="isSpecial">
  </div>
</div>

JS

JS

angular.module('app', []);

angular.module('app')
    .controller('MainController', mainController);

mainController.$inject = ['$scope'];

function mainController($scope){

  $scope.check = 0;
  $scope.isSpecial = ($scope.check === 1) ? true : false;

}