Zmiana ng-hide na podstawie wartości zmiennej w angular.js

Question

Jestem początkującym użytkownikiem angular.js i odziedziczyłem kod. Istnieje zestaw danych (customerType), który wyświetla się za pomocą polecenia ng-repeat. Są 3 wiersze tabeli, które chcę wyświetlać tylko wtedy, gdy typ_klienta jest równy "nowy". Te 3 wiersze mają "ng-hide =" w odpowiednich tagach poniżej. Jak to zrobić w pliku angular.js? Wszystkie dyrektywy zdają się dotyczyć całego ekranu, więc nie jestem pewien, jak zmienić zmienną zakresu tylko dla części ekranu. Oto html:

<div ng-repeat="customerType in customerTypes" class="span6"> 
    <table class="table table-bordered table-striped"> 
    <thead> 
     <tr> 
     <th colspan="3"> 
      <div class="span11 centered-text"> 
       {{customerType.title}} 
      </div> 
      <div class="span1"> 
       <a href="javascript:void(0);" ng-click="pullDetail(customerType.type, customerType.clients)" title="Details"><i class="icon-list-alt"></i></a> 
      </div> 
     </th> 
     </tr> 
     <tr> 
     <th></th> 
     <th> 
      <div class="centered-text"> 
      Month Selected 
      </div> 
     </th> 
     <th> 
      <div class="centered-text"> 
      YTD 
      </div> 
     </th> 
     </tr>        
    </thead> 
    <tbody> 
     <tr> 
     <td>Revenue</td> 
     <td>{{customerType.month.revenue}}</td> 
     <td>{{customerType.ytd.revenue}}</td> 
     </tr> 
     <tr> 
     <td>Gross Profit</td> 
     <td>{{customerType.month.gross}}</td> 
     <td>{{customerType.ytd.gross}}</td> 
     </tr> 
     <tr> 
     <td># of Customers</td> 
     <td>{{customerType.month.customers}}</td> 
     <td>{{customerType.ytd.customers}}</td> 
     </tr> 
     <tr> 
     <td>Avg GP per Customer</td> 
     <td>{{customerType.month.avg_gp}}</td> 
     <td>{{customerType.ytd.avg_gp}}</td> 
     </tr> 
     <tr> 
     <td># of Jobs</td> 
     <td>{{customerType.month.jobs}}</td> 
     <td>{{customerType.ytd.jobs}}</td> 
     </tr> 
     <tr ng-hide=> 
     <td>First Time Client - Revenue</td> 
     <td>{{customerType.month.ftc_revenue}}</td> 
     <td>N/A</td> 
     </tr> 
     <tr ng-hide=> 
     <td>First Time Client - Gross Profit</td> 
     <td>{{customerType.month.ftc_gross}}</td> 
     <td>N/A</td> 
     </tr> 
     <tr ng-hide=> 
     <td>First Time Client - # of Customers</td> 
     <td>{{customerType.month.ftc_customers}}</td> 
     <td>-----</td> 
     </tr> 
     <tr ng-hide=> 
     <td>First Time Client - # of Jobs</td> 
     <td>{{customerType.month.ftc_jobs}}</td> 
     <td>-----</td> 
     </tr> 
     <tr> 
     <td>% on Contract</td> 
     <td>{{customerType.month.contract}}</td> 
     <td>{{customerType.ytd.contract}}</td> 
     </tr> 
    </tbody> 
    </table> 
</div> 

i tutaj są obecne dyrektywy:

var ReportController = function($scope, $http){ 
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded"; 

$scope.filter = true; 
$scope.report = false; 
$scope.detail = false; 

$scope.customerTypes = []; 
$scope.detail_report = []; 
$scope.companies = companies; 
$scope.nsperiods = nsperiods; 
$scope.users = users; 

$scope.pullReport = function(sync){ 
    if(sync){ 
     var xsr = {request: 'report', company_no: $scope.company, nsperiod: $scope.nsperiod, users_no: $scope.user}; 
     $('form button').button('loading'); 
     $http({ 
      method: 'POST', 
      headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
      transformRequest: function(obj) { 
       var str = []; 
       for(var p in obj) 
       str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
       return str.join("&"); 
      }, 
      data: xsr 
     }).success(function(response){ 
      $scope.filter = false; 
      $scope.report = true; 
      $scope.detail = false; 
      $('form button').button('reset'); 
      $scope.customerTypes = response; 
     }).error(function(error){ 
      $('form button').button('reset'); 
      return; 
     }); 
    }else{ 
     $scope.filter = false; 
     $scope.report = true; 
     $scope.detail = false; 
    } 
} 

$scope.backToFilters = function(){ 
    $scope.filter = true; 
    $scope.report = false; 
    $scope.detail = false; 
} 

$scope.pullDetail = function(type, clients){ 
    var xsr = { 
     request: 'detail', 
     type: type, 
     company_no: $scope.company, 
     nsperiod: $scope.nsperiod, 
     users_no: $scope.user 
    }; 
    $http({ 
     method: 'POST', 
     headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
     transformRequest: function(obj) { 
      var str = []; 
      for(var p in obj) 
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
      return str.join("&"); 
     }, 
     data: xsr 
    }).success(function(response){ 
     $scope.filter = false; 
     $scope.report = false; 
     $scope.detail = true; 
     $scope.detail_report = response; 
    }).error(function(error){ 
     return; 
    });     
} 
}; 

Każda pomoc będzie mile widziana. Próbuję to objąć, ale coś po prostu nie jest do końca połączone.

Answer 1

Po prostu pokazuje/ukrywa się na podstawie tej zmiennej?
zrobiłbym:

ng-show="customerType.type == 'new'"