How to use ng-if for angular in portal

David Cross
Tera Expert

I am new to portal and angular, Can you please guide me here..
What i want is when i put invalid incident number in the text field it should give error message

Html
<div class="form-group">
<input class="btn btn-primary btn-block" ng-click="c.addItem()" value="Search" type="submit">
</div>

<div class ="list-group">
<a class ="list-group-item" ng-repeat="values in data.val">
<b class="text-primary"> {{values.number}}</b><br>
<b class="text-primary"> {{values.sd}}</b><br>

<------ Msg if incident is not found ------> /// here it should show some invalid msg
</a>
</div>


Server Side :
(function() {
if(!input)
return;
data.val = [];

if(input){
var gr = new GlideRecord('incident');
gr.query('number',input.inc);
gr.query();
if(gr.next()){
var values ={};
values.number = gr.getValue('number');
values.sd = gr.getValue('short_description');
data.val.push(values);
}else{
data.val.push('Incident not found');         /// why is this not working ??,
}}})();

1 ACCEPTED SOLUTION

Tony DiRienzo
Giga Guru

You can probably just add the message in your HTML.  Take out the line from your server script that says "data.val.push('Incident not found');", then add this line to your HTML where you want the message to display:

<p ng-if="!data.val.length">${Incident not found}</p>

If there are no elements in the data.val array, length will be 0, which is falsy, so the message will display.

(Sidenote, the ${} around the message is not strictly necessary. Including it allows for internationalization.)

Edit: I should mention that the ng-if statement should be outside of your ng-repeat.  Something like this:

<a ng-repeat="value in data.val">
  ....
</a>
<p ng-if="!data.val.length">${Incident not found}</p>

View solution in original post

2 REPLIES 2

Tony DiRienzo
Giga Guru

You can probably just add the message in your HTML.  Take out the line from your server script that says "data.val.push('Incident not found');", then add this line to your HTML where you want the message to display:

<p ng-if="!data.val.length">${Incident not found}</p>

If there are no elements in the data.val array, length will be 0, which is falsy, so the message will display.

(Sidenote, the ${} around the message is not strictly necessary. Including it allows for internationalization.)

Edit: I should mention that the ng-if statement should be outside of your ng-repeat.  Something like this:

<a ng-repeat="value in data.val">
  ....
</a>
<p ng-if="!data.val.length">${Incident not found}</p>

Hello Tony, Thank You for helping me here.. i'll try this once