AngularJS - Manage button or input availability via model - angularjs

Question

So, i'm quite stuck at this:
I have quite many buttons on my page, each button's availability is different in different context, for example:
When button "Add" is pressed, its state will be "disabled", Cancel and Save buttons will be available.
I came up with a solution to manage the stage of every buttons in one object call state, like this:
// This is the Controller
$scope.some_id = false;
// With some UI interaction, $scope.some_id will be some integer value
$scope.getContextBtnAdd = function(){ return $scope.some_id; };
$scope.getContextBtnCancel = function(){ return !$scope.getContextBtnAdd(); };
$scope.state = {
contextBtns : {
btnAdd : $scope.getContextBtnAdd(),
btnCancel: $scope.getContextBtnCancel(),
},
footerBtns : { Some footer buttons }
};
// This is the View
<button name="add" ng-disabled="!state.contextBtns.btnAdd">Add</button>
"So when there is no product load, $scope.some_id will be false, so Add button will be available, but when user clicks on some products, the $scope.some_id will be some integer value like 4,7 or 100... and the button will be disabled. " <=== That's what i want. But actually it doesn't work, the some_id changes but maybe the getContext function is never called. Right now i have to pass the getContext function to ng-disabled like this:
<button name="add" ng-disabled="!getContextBtnAdd()">Add</button>
But i want to manage them all via one object. So what's is my code problem and is there any better way to manage button, input....s availabilities?
Thank you!

Answer 1

When that line is executed:
$scope.state = {
contextBtns : {
btnAdd : $scope.getContextBtnAdd(),
btnCancel: $scope.getContextBtnCancel(),
},
footerBtns : { Some footer buttons }
};
the state object is created, and its contextBtns.btnAdd attribute (for example) takes the value returned by $scope.getContextBtnAdd() at that time. The attribute value never changes after.
What you want instead is something that always has the value of $scope.getContextBtnAdd() every time it's evaluated. So you simply need the function itself:
$scope.state = {
contextBtns : {
btnAdd : $scope.getContextBtnAdd,
btnCancel: $scope.getContextBtnCancel,
},
footerBtns : { Some footer buttons }
};
and in the view:
<button name="add" ng-disabled="!state.contextBtns.btnAdd()">Add</button>