Reputation: 527
so I have a json object and also a edit button. I am wondering how to disable that edit button if the value is not equal to Peter so that the user cannot edit it.
angular.module('app')
.factory('WebApi', function () {
//Dummy Data
var name = [{
value: "Peter",
text: "Peter"
}, {
value: "John",
text: "John"
}, {
value: "Lucy",
text: "Lucy",
}, {
value: "Hawk",
text: "Hawk"
}];
var tempData = [];
//Display 100 item
for (var i = 0; i < 100; i++) {
var selectedName = name[Math.floor((Math.random() * name.length))];
tempData.push({
name: selectedName.text
})
};
constants.js
angular.module('app')
.factory('Constants', function () {
return {
status: {
Peter: 'Peter'
}
};
});
button
<ion-list can-swipe="listCanSwipe">
<ion-item ng-repeat="data in tempData"
item="data">
Name: {{data.name}}
<ion-option-button class="button-calm"
ng-click="edit(data)">
Edit
</ion-option-button>
</ion-item>
</ion-list>
Upvotes: 1
Views: 1048
Reputation: 28455
Use ng-disabled
like following
<ion-option-button ng-disabled="data.name!='peter'" class="button-calm"ng-click="edit(data)">
Edit
</ion-option-button>
For reference - https://docs.angularjs.org/api/ng/directive/ngDisabled
Upvotes: 1
Reputation: 2090
In Html
ng-disabled="someFunction()"
In your JS
$scope.someFunction = function() {
// return true or false.
};
Upvotes: 0
Reputation: 12093
Use ng-disabled: Examlpe:-
<ion-option-button ng-disabled="name.value!='peter'" class="button-calm"ng-click="edit(data)">
Edit
</ion-option-button>
Upvotes: 1