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.

Answer 1

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>

Answer 2

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>