La case à cocher Angularjs est cochée par défaut sur load et désactive la liste de sélection lorsque cochée
noob sur un débordement de pile ici. Je travaille sur une page Web qui a une fonction de transfert d'emploi. Cela permet à l'utilisateur de cocher une case pour renvoyer le travail au bureau, ou de sélectionner un technicien à partir d'une liste de tout ce qui est disponible. Ma question Est de savoir comment configurer la case à cocher pour qu'elle soit cochée par défaut lorsque la page se charge et que la liste de sélection soit désactivée en conséquence. Voici le code que j'ai pour le moment:
<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>
et voici un jsfiddle pour elle: http://jsfiddle.net/hugmungus/LvHJw/5/
actuellement, la page se charge avec la case cochée, mais la liste n'est pas désactivée. Si vous décochez puis vérifiez de nouveau le, la liste devient invalide.
Merci pour votre aide!
3 réponses
Si vous utilisez ng-model, vous ne voulez pas également utiliser ng-vérifié. Au lieu de cela, il suffit d'initialiser la variable model à true. Normalement, vous le feriez dans un controller qui gère votre page (en ajouter un). Dans votre violon, je viens de faire l'initialisation dans un attribut ng-init à des fins de démonstration.
<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>
le Faire dans le controller ( contrôleur de syntaxe ci-dessous)
contrôleur:
vm.question= {};
vm.question.active = true;
formulaire
<input ng-model="vm.question.active" type="checkbox" id="active" name="active">
Vous n'avez pas vraiment besoin de la directive, vous pouvez la réaliser en utilisant le ng-init et le ng-checked. le lien de démonstration ci-dessous montre comment définir la valeur initiale de la case à cocher dans angularjs.
<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) {
});