CODEWITHSUNDEEP
angularjs
iceblender
iceblender

Reputation: 59

Print Conditionals AngularJS

This is how input is set up:

input type="number" ng-model="yourNum" placeholder="Enter a number here"

I want to now parse this numerical input and perform the modulo function on it, and then print a statement.

I know I can use the modulo function, I'm wondering how to print statements based on the result. Ex: if (yourNum % 3 == 0) print "hello"

I'm having trouble using ng-if

Upvotes: 0

Views: 175

Answers (2)

user2033671
user2033671

Reputation:

If you want the content to be completely remove from the DOM when your conditional statement is true you can utilize the ngIf directive to conditionally include bits of HTML

<span ng-if="yourNum % 3 === 0">hello<span>

Or if you want it to always be there just hidden from the user you can use ng-show

<span ng-show="yourNum % 3 === 0">hello<span>

JS does some auto type conversion for you so in this instance the comparison will work. Search for js auto type conversion if you want some more info on it.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
  <input type="number" ng-model="yourNum" placeholder="Enter a number here">
  <span ng-if="yourNum % 3 === 0">yo</span> 
  <span ng-if="yourNum % 4 === 0">hello</span> 
</div>

Upvotes: 1

Sharikov Vladislav
Sharikov Vladislav

Reputation: 7269

HTML:

<input type="number" ng-change="onNumberChange()" ng-model="yourNum" />
<p>{{ error }}</p>

Java Script:

$scope.onNumberChange = function () {
    $scope.error = $scope.yourNum%3 === 0 ? 'some error' : '';
}

Example

Upvotes: 0

Related Questions