Empty Message Is not showing in empty table in ng-repeat angularjs

Question

Empty Text is not showing In table I am using table which is empty Now

<table class="table table-bordered table-hover">
    <thead>
        <tr>
            <th>ID</th>
            <th>Privilege Name</th>
            <th>PageUrl</th>
            <th>Can Add</th>
            <th>Can Edit</th>
            <th>Can Delete</th>
            <th>Can View</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="obj in getAssignedPrivilegeslist" ng-show="getAssignedPrivilegeslist.length !=0 && getAssignedPrivilegeslist !='null'">
            <td>{{$index+1}}</td>
            <td>{{obj.PageName}}</td>
            <td><a ng-href="{{'//'+obj.PageUrl }}">{{obj.PageUrl}}</a></td>
            <td>
                <input type="checkbox" name="Add" value="Add" ng-model="obj.CanCreate" />
            </td>
            <td>
                <input type="checkbox" name="Edit" value="Edit" ng-model="obj.CanEdit" />
            </td>
            <td>
                <input type="checkbox" name="Delete" value="Delete" ng-model="obj.CanDelete" />
            </td>
            <td>
                <input type="checkbox" name="View" value="View" ng-model="obj.CanView" />
            </td>
            <td ng-show="getAssignedPrivilegeslist.length==0" id="nofoundop">Please Select Operator</td>
        </tr>
    </tbody>
</table>

Then I set a <td> if data length is 0 then show the given message but it is not showing. Please help I will be very thankful to you all.

FYI, ng-show="getAssignedPrivilegeslist.length !=0 && getAssignedPrivilegeslist !='null'" would be better written as ng-show="getAssignedPrivilegeslist.length". If the list's length is any number besides 0, it'll evaluate as true, and if it's 0 or can't be accessed (because it's undefined), it'll evaluate as false. However, you'll run into problems if you're actually storing the string literal 'null' as its value, so change that to null instead if you were. — Harris
– Harris, Commented Dec 9, 2016 at 16:41

Community · Accepted Answer · 2017-05-23 12:30:52Z

3

These three changes you have to made in your code :

Instead of ng-show="getAssignedPrivilegeslist.length !=0" you can use ng-show="getAssignedPrivilegeslist.length". As suggested by Harris Weinstein in his comment that if the list's length is any number besides 0, it'll evaluate as true, and if it's 0 or can't be accessed (because it's undefined), it'll evaluate as false.
Instead of using string literal getAssignedPrivilegeslist !='null' use getAssignedPrivilegeslist !=null.
Put your element having error message outside the <tr> as you already put the ng-show="getAssignedPrivilegeslist.length !=0" in the <tr> tag.

You can use like this outside your <tr> tag as suggested by sexta13:

<tr ng-show="getAssignedPrivilegeslist.length==0" >
   <td id="nofoundop">
      please select operator
   </td>
</tr>

edited May 23, 2017 at 12:30

CommunityBot

11 silver badge

answered Dec 9, 2016 at 19:20

Rohìt Jíndal

27.3k16 gold badges80 silver badges133 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

sexta13 · Accepted Answer · 2016-12-09 15:55:04Z

1

You have your logic not very well structured.

You have your

<td ng-show="getAssignedPrivilegeslist.length==0" id="nofoundop">
    Please Select Operator
</td>

inside a ng-repeat that will only happen if getAssignedPrivilegeslist.length !=0 && getAssignedPrivilegeslist !='null'

You should have another tr outside the ng-repeat with something like this:

<tr ng-show="getAssignedPrivilegeslist.length==0" >
   <td id="nofoundop">
      please select operator
   </td>
</tr>

edited Dec 9, 2016 at 15:55

answered Dec 9, 2016 at 15:45

sexta13

1,5781 gold badge11 silver badges19 bronze badges

Collectives™ on Stack Overflow

Empty Message Is not showing in empty table in ng-repeat angularjs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related