Angularjs - Array items dependent property not updating - angularjs

Question

I have this scope array variable
$scope.menuItems = [
{
name: 'Login',
url:'#/login',
isAvailable: true
},
{
name: 'Register',
url: '#/register',
isAvailable: $scope.global.roleId == null
},
{
name: 'My Restaurants',
url: '#/myrestaurants',
isAvailable: $scope.global.roleId == constants.OWNER_USER_ROLE_ID
},
{
name: 'Create Restaurant',
url: '#/createrestaurant',
isAvailable: $scope.global.roleId == constants.OWNER_USER_ROLE_ID
},
{
name: 'Logout',
url: '#/logout',
isAvailable: $scope.global.roleId != null
}
];
This object is dependent on another scope variable $scope.global.roleId
I am loading menu from this array like this
<ul class="nav navbar-nav">
<li ng-repeat="n in menuItems | filter:{isAvailable:true}">
{{n.name}}
</li>
</ul>
And I want it to update menus automatically when $scope.global.roleId is updated.
To be noted, I am updating this variable $scope.global.roleId from a child controller and this field is getting updated properly but it is not affecting the array field isAvailable.
I checked both the variables $scope.global.roleId and $scope.menuItems in log and $scope.global.roleId is updating properly everytime but not $scope.menuItems.isAvailable field which is dependent on former
What wrong am I doing or expecting? And what is the right way to achieve this?

Answer 1

Achieved it like this, converting variable to property
{
name: 'My Restaurants',
url: '#/myrestaurants',
get isAvailable() {
return $scope.global.roleId == constants.OWNER_USER_ROLE_ID;
}
},