I have a simple scope variable on my AngularJS Controller. It is assigned a specific endpoint value like this:
$scope.isItAvailable = endpoint.IS_IT_AVAILABLE;
How can I properly use it in my view (HTML) to conditionally show or hide an element using ng-if based on its boolean value?
I attempted to achieve this by implementing a function ctrl.checkIfavailable, and calling it in the HTML, but unfortunately, the value is not being read on the view side.
For example:
$scope.checkIfItIsAvailable = () => {
return $scope.isZKAvailable
}
I then tried using this function in the ng-if. I also tried defining it in the controller, but had no success.
When I console.log the response from the server, I receive a boolean value of either true or false, depending on the situation.
Here is how I wrote the HTML code:
<div class="col-lg-8" ng-if="Ctrl.isItAvailable">
.... // Additional code here
</div>
In the controller, I have the following code:
$scope.isItAvailable = endpoint.IS_IT_AVAILABLE;
console.log(endpoints.IS_IT_AVAILABLE); // This returns the desired boolean value
Current Outcome Currently, when I leave the ng-if as it is, the element remains hidden as it does not access it at all.
Expected Outcome I aim to display/hide the element based on the value of isItAvailable.