如何使用ng-if和ng-disabled
[英]How to use ng-if with ng-disabled
问题描述
Below is my Code. 
以下是我的代码。
var myfriend = angular.module('myfriend',[]); myfriend.controller('myfriendController', function($scope) { $scope.record = [ { "id" : "01", "firstname" : "Mohan ", "middlename" : "K", "lastname" : "Futterkiste1" },{ "id" : "04", "firstname" : "Rohan ", "middlename" : "A", "lastname" : "Futterkiste2" },{ "id" : "08", "firstname" : "sohan ", "middlename" : "M", "lastname" : "Futterkiste3" } ] });
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> </head> <body ng-app="myfriend"> <table class="table" style="border:1px red solid; width:100%; " ng-controller="myfriendController"> <thead> <tr> <th>Id</th> <th>First name</th> <th>Middle name</th> <th>Last name</th> </tr> </thead> <tbody> <tr ng-repeat="x in record"> <th>{{x.id}}</th> <th><input type="text" ng-value="x.firstname"></th> <th><input type="text" ng-value="x.middlename"></th> <th><input type="text" ng-value="x.lastname"></th> </tr> <tr> <td><button> Submit</button></td> </tr> </tbody> </table> <body> </html>
What I want is on click of submit button, it should disabled the field of Rohan only(Rohan is coming through ng-repeat).I want to achieve this through ng-disabled in ng-if. 我想要的是点击提交按钮，它应该只禁用Rohan的字段（Rohan正在通过ng-repeat）。我想通过ng-if中的ng-disabled来实现这一点。
Help me for this. 帮助我。
2 个解决方案
解决方案1
2 已采纳 2017-01-20 12:41:12
You can by doing this 你可以这样做
<tr ng-repeat="x in record">
<th>{{x.id}}</th>
<th><input type="text" ng-model="x.firstname" ng-disabled="x.disabled" value="x.firstname"></th>
<th><input type="text" ng-model="x.middlename" value="x.middlename"></th>
<th><input type="text" ng-model="x.lastname" value="x.lastname"></th>
</tr>
Controller 调节器
Just add disabled attribute to 'Rohan' after submit 只需在提交后将“禁用”属性添加到“Rohan”即可
var myfriend = angular.module('myfriend',[]);
myfriend.controller('myfriendController', function($scope)
{
$scope.record = [
{ "id" : "01",
"firstname" : "Mohan",
"middlename" : "K",
"lastname" : "Futterkiste1"
},{
"id" : "04",
"firstname" : "Rohan",
"middlename" : "A",
"lastname" : "Futterkiste2"
},{
"id" : "08",
"firstname" : "sohan",
"middlename" : "M",
"lastname" : "Futterkiste3"
}
]
$scope.submit = function () {
angular.forEach($scope.record, function (v) {
if (v.firstname === 'Rohan') {
v.disabled = true;
}
});
console.log($scope.record);
}
});
解决方案2
1 2017-01-20 11:51:58
I think, thing is not possible, because ng-if delete the html tags. 我认为，事情是不可能的，因为ng-if删除了html标签。 Like 喜欢
<div ng-if="error">
<input type="text" ng-disabled="disable">
</div>
its means inside tag div nothing will load in dom if error == true; 它的意思是在标签div内，如果错误== true，则无法在dom中加载; so ng-disable is no available in this case. 所以在这种情况下，ng-disable不可用。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.