Question

堆栈溢出的

noob在这里。我正在开发一个具有转移工作职能的网页。这允许用户选中复选框以将作业发送回办公室，或从所有可用列表中选择技术人员。我的问题是如何设置复选框，以便在页面加载时默认选中它并相应地禁用选择列表。这是我目前的代码：

<div ng-app="">
  Send to Office: <input type="checkbox" ng-model="checked" ng-checked="true"><br/>
  <select id="transferTo" ng-disabled="checked">
    <option>Tech1</option>
    <option>Tech2</option>
  </select>
</div>

这里有一个jsfiddle：http://jsfiddle.net/hugmungus/LvHJw/5/

目前，页面加载并选中复选框，但未禁用该列表。如果您取消选中然后重新检查它，列表将被禁用。

感谢您的帮助！

Answer 1

如果您使用ng-model，则不希望也使用ng-checked。而只是将模型变量初始化为true。 通常你会在管理页面的控制器中执行此操作（添加一个）。在你的小提琴中，我只是在ng-init属性中进行初始化以进行演示。

http://jsfiddle.net/UTULc/

<div ng-app="">
  Send to Office: <input type="checkbox" ng-model="checked" ng-init="checked=true"><br/>
  <select id="transferTo" ng-disabled="checked">
    <option>Tech1</option>
    <option>Tech2</option>
  </select>
</div>

Answer 2

在控制器中执行此操作（控制器如下面的语法）

<强>控制器：

vm.question= {};
vm.question.active = true;

<强>形式

<input ng-model="vm.question.active" type="checkbox" id="active" name="active">

Answer 3

您并不真正需要该指令，可以通过使用ng-init和ng-checked来实现。下面的demo链接显示了如何设置angularjs中复选框的初始值。

demo link：

<form>
    <div>
      Released<input type="checkbox" ng-model="Released" ng-bind-html="ACR.Released" ng-true-value="true" ng-false-value="false" ng-init='Released=true' ng-checked='true' /> 
      Inactivated<input type="checkbox" ng-model="Inactivated" ng-bind-html="Inactivated" ng-true-value="true" ng-false-value="false" ng-init='Inactivated=false' ng-checked='false' /> 
      Title Changed<input type="checkbox" ng-model="Title" ng-bind-html="Title" ng-true-value="true" ng-false-value="false" ng-init='Title=false' ng-checked='false' />
    </div>
    <br/>
    <div>Released value is  <b>{{Released}}</b></div>
    <br/>
    <div>Inactivated  value is  <b>{{Inactivated}}</b></div>
    <br/>
    <div>Title  value is  <b>{{Title}}</b></div>
    <br/>
  </form>

// Code goes here

  var app = angular.module("myApp", []);
        app.controller("myCtrl", function ($scope) {

         });

Answer 4

在控制器中完成

$timeout(function(){
$scope.checked = true;
}, 1);

然后删除ng-checked。

默认情况下在加载时选中Angularjs复选框并禁用选中时选择列表

4 个答案: