Динамически дисплей таблица в угловом

Question

мне нужно динамически отображать таблицу в Угловом, в зависимости от информации, поступающей из БДА

До сих пор, у меня есть эта информация

[ { "BET": 57630343, "CUSTOMER": 181645, "XX_FILL OPEN": true }, 
    { "BET": 57633044, "CUSTOMER": 181645, "XX_FILL OPEN": true }, 
    { "BET": 57633047, "CUSTOMER": 181645, "XX_FILL OPEN": true }, 
    { "BET": 57635034, "CUSTOMER": 181645, "XX_FILL OPEN": true } ] 

все с XX... должна быть button

и в HTML

 <table> 
     <thead> 
      <tr> 
      <th>Bet</th> 
      <th>Customer</th> 
      <th>Fill Open Bet</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="pendingBet in pendingBets"> 
      <td> {{::pendingBet.BET}}</td> 
      <td> {{::pendingBet.CUSTOMER}}</td> 
      <td><button class="btn btn-danger">Fill</button></td> <!--{{pendingBet.XX_FILL_OPEN}}--> 
      </tr> 
     </tbody> 
     </table> 

вопрос у меня есть здесь: выше у меня есть что-то вроде статического

  <th>Bet</th> 
      <th>Customer</th> 
      <th>Fill Open Bet</th> 

но иногда <th>Bet</th>, который <td> {{::pendingBet.BET}}</td> не приходит из БД, так что я не должен показывать, так что я хочу знать, что должен ли я отображать его динамически

Что делать в этом случае?

EDIT

Пусть объясниться лучше:

в соответствии с таблицей, <td> {{::pendingBet.BET}}</td> принадлежит <th>Bet</th>, но иногда pendingBet.BET это null так что я не должен показывать все, что столбец <th>Bet</th> и <td> {{::pendingBet.BET}}</td>, то же самое с Customer и Fill Open.

Answer 1

Вы можете использовать ng-if на <th> и <td>:

<table> 
    <thead> 
     <tr> 
     <th ng-if="hasBetColumn">Bet</th> 
     <th>Customer</th> 
     <th>Fill Open Bet</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="pendingBet in pendingBets"> 
     <td ng-if="hasBetColumn"> {{::pendingBet.BET}}</td> 
     <td> {{::pendingBet.CUSTOMER}}</td> 
     <td><button class="btn btn-danger">Fill</button></td> <!--{{pendingBet.XX_FILL_OPEN}}--> 
     </tr> 
    </tbody> 
    </table> 

Это до вас, чтобы определить, как вы хотите установить hasBetColumn, либо в контроллере или как часть возвращаемых данных из вашего API вызова.

Answer 2

Если все поля являются динамическими:

В вас чтрлах, вам нужен массив для хранения полей, которые вы хотите отобразить, если назначить его Object.keys(data[0]) каждый раз, когда вы инициализируете Ctrl, вы не можете увидеть та же таблица, потому что порядок свойств объектов не гарантируется в js.

в Ctrl

//Leat's say you have lodash (or underscore, if you dont you should...) 
$scope.fields = _.intersection(["BET", "CUSTOMER", "whatever"], 
    _.keys(data ? data[0] : {}) 
) 

в HTML

<tbody> 
    <!-- ng-repeat on fields in `thead ` --> 
    <tr ng-repeat="pendingBet in pendingBets"> 
     <td ng-repeat="field in fields" ng-bind="::pendingBet[field]"></td> 
    </tr> 
</tbody>