AngularJSでプロパティが利用可能かどうかに基づいてオブジェクトをフィルタリングする方法

Question

「Company Name」プロパティが== nullでない場合の結果のみを返したいとします。 「Company Name == N/A」のすべての結果は表示されません。

<li><input class="form-control fInput" data-ng-model="search.CompanyName"></li> 



<div class="col-lg-12 col-md-12 main"> 
     <div ng-if="isEditMode == false" class="col-lg-4" ng-class="{'active':isSelectedContact(contact.ContactId)}" ng-repeat="contact in contacts | filter:{Category:{CategoryId:currentCategory.CategoryId}} 
                                        | filter: search.CompanyName 
                                        | orderBy: ['LastName','FirstName'] "> 



      <div class="img-rounded contactBoxes"> 
       <button type="button" class="btn btn-default btn-xs smBtn" title="Delete Contact"><span class="glyphicon glyphicon-remove"></span></button> 
       <button type="button" ng-click="editContact(contact)" class="btn btn-default btn-xs smBtn" title="Edit Contact"><span class="glyphicon glyphicon-pencil"></span></button> 
       {{contact.FirstName}} {{contact.MiddleName}} {{contact.LastName}}<br /> 
       Company: {{contact.CompanyName || "N/A"}}<br /> 
       Email: <a href="mailto:{{contact.Email}}">{{contact.Email}}</a><br /> 
       Cell: {{contact.CellPhone}}<br /> 
       Work: {{contact.WorkPhone || "N/A"}} 
      </div> 
     </div> 

Answer 1

あなたがnullの仕入との結果をレンダリングしないようにしたい場合は、シンプルなng-if条件は十分です：

<div ng-if="isEditMode == false && contact.CompanyName != null" class="col-lg-4" 
    ng-class="{'active':isSelectedContact(contact.ContactId)}" 
    ng-repeat="contact in contacts | filter:{Category: {CategoryId:currentCategory.CategoryId}} | filter: search.CompanyName | orderBy: ['LastName','FirstName']"> 

... 

</div> 

Answer 2

contact.CompanyNameが

<div class="img-rounded contactBoxes" ng-show="contact.CompanyName != null"> 
       <button type="button" class="btn btn-default btn-xs smBtn" title="Delete Contact"><span class="glyphicon glyphicon-remove"></span></button> 
       <button type="button" ng-click="editContact(contact)" class="btn btn-default btn-xs smBtn" title="Edit Contact"><span class="glyphicon glyphicon-pencil"></span></button> 
       {{contact.FirstName}} {{contact.MiddleName}} {{contact.LastName}}<br /> 
       Company: {{contact.CompanyName || "N/A"}}<br /> 
       Email: <a href="mailto:{{contact.Email}}">{{contact.Email}}</a><br /> 
       Cell: {{contact.CellPhone}}<br /> 
       Work: {{contact.WorkPhone || "N/A"}} 

</div> 

nullでない場合、それはチェックします ng-show使用してください