I would like to check the value of the property of an object and would like to check the data of string to compare.
<div ng-if="results.dataType === 'textTable'">
This text belongs in a table.
</div>
So far all the divs appear with the text in the body where only two divs should display it.
Is there anything wrong with my ng-if statement and string comparison?
ngIf expression example and === and == operator is used to compare the strings and returns Boolean value.
Use double equal to == operator to check equality or better use === to check strict equality. You should use === in Javascript instead.
You can use String#indexOf to get the index of the needle in haystack. If the needle is not present in the haystack -1 is returned. If needle is present at the beginning of the haystack 0 is returned. Else the index at which needle is, is returned.
How to check if a variable string is empty or undefine or null in Angular. In template HTML component: We can use the ngIf directive to check empty null or undefined. In this example, if stringValue is empty or null, or undefined, It prints the empty message.
AngularJS ng-if Directive 1 Definition and Usage. The ng-if directive removes the HTML element if the expression evaluates to false. ... 2 Syntax. Supported by all HTML elements. 3 Parameter Values. An expression that will completely remove the element if it returns false. If it returns true, a copy of the element will be inserted instead.
How to check an element with ng-if is visible on DOM ? ng-if directive: The ng-if directive in AngularJS is used to remove or recreate a portion of the HTML element based on an expression. If the expression inside it is false then the element is removed and if it is true then the element is added to the DOM.
If only one of the conditions is true, you can use *ngIf to display the element with the help of the OR (||) operator. The following code snippet demonstrates the use of the OR condition in ngIf. OR Condition in *ngIf (!) To reverse the *ngIf condition, we can use the NOT operator (!) as seen below.
ng-if Directive: The ng-if Directive in AngularJS is used to remove or recreate a portion of HTML element based on an expression. If the expression inside it is false then the element is completely removed from the DOM. if the expression is true then the element will be added to the DOM.
Here is the demo Jsfiddle
Js code
var app = angular.module('myApp', []);
app.controller('ctrl', function($scope) {
$scope.results = {
dataType: 'textTable'
};
$scope.flag = true;
// for testing purpose
$scope.toggle = function() {
if ($scope.flag) {
$scope.results = {
dataType: 'textTable'
};
$scope.flag = !$scope.flag;
} else {
$scope.results = {
dataType: 'textTableNot'
};
$scope.flag = !$scope.flag;
}
}
});
HTML
<div ng-app='myApp'>
<div ng-controller='ctrl'>
<div ng-if='results.dataType === "textTable"'> This text belongs in a table.</div>
{{results.dataType}}
<button ng-click='toggle()'>
Toggle
</button>
</div>
</div>
Hope this will resolve your problem
Hope this will resolve your problem.
<div>
<input type="hidden" ng-model="myVar" ng-init="myVar = 'stringformat'">
<div ng-if="myVar =='stringformat'">
<h1>Welcome</h1>
<p>Welcome to my home.</p>
</div>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With