Maison > Article > interface Web > Explication détaillée de l'opération de liaison de valeur d'élément de formulaire AngularJS
Cet article présente principalement l'implémentation AngularJS des opérations de liaison de valeurs d'éléments de formulaire et analyse les techniques d'exploitation liées à AngularJS pour les attributs d'éléments de formulaire sur la base d'exemples spécifiques. Les amis qui en ont besoin peuvent s'y référer.
ng-disabled : lier l'attribut désactivé du contrôle ng-show : afficher ou masquer les éléments : ms-visible ng-hide : exactement la fonction opposée de ng-show
Contenu CSS :
p.d1{
width: 20px;
height: 20px;
background-color: pink;
}
p.d2{
width: 20px;
height: 20px;
background-color: black;
}Texte HTML :
<body ng-app="myApp" ng-controller="myctr">
<p>
请输入：<input type="text" placeholder="....." ng-disabled="flag">{{flag}}<br>
切换输入：<input type="button" value="switch input" ng-click="switchInput();">
</p>
<hr ng-init="checkValue=false">
input:<input type="text" ng-disabled="checkValue">{{checkValue}}<br>
<input type="checkbox" ng-model="checkValue">stop input <!-- 注意ng-model不能作用于单选框 -->
<hr>
<p>ng-show:flag</p>
<p class="d1" ng-show="flag"></p>
<p>ng-hide:checkValue</p>
<p class="d2" ng-hide="checkValue"></p>
<hr>
<!-- ng-click：后面可以直接跟表达式，表达式会直接执行，变量不支持++操作 -->
<input type="button" ng-click="count = count + 1" value="加1">：{{count}}Code d'opération Javascript :
var app = angular.module('myApp', []);
app.controller('myctr', function($scope) {
$scope.flag=false;
$scope.count=0;
$scope.switchInput=function(){
$scope.flag=!$scope.flag;
};
});Effet :
Recommandations associées :
in_array() en javascript pour trouver les valeurs des éléments dans un tableau
Méthode d'implémentation de la fonction de validation de formulaire AngularJS
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!