2017-03-01 3 views
1

Ich habe eine ngTable wie unten.Verstecke ngTable td mit Datentitel

Ich wollte die erste Zelle mit ng-if basierend auf der Rolle ausblenden.

Wenn ich hinzugefügt ng-wenn dann der Inhalt des td (Radio Button) ist versteckt korrekt, aber der Daten-Titel ist noch sichtbar auf dem Bildschirm

Ist es möglich, die td vollständig zu verbergen?

<table ng-table="tableParam" 
    class="table table-striped table-hover table-bordered list-table" id="tableList" 
    fixed-header > 
     <tr ng-repeat="valuesList in $data"> 
      <td ng-if="role=='ADMIN'" data-title="'Select'"> 
        <input type="radio" name="selectRadio" ng-model="selectRadio" ng-value="valuesList" ></input> 
      </td> 
      <td data-title="'Start Date'">{{valuesList.startDate}}</td> 
      <td data-title="'End Date'">{{valuesList.endDate}}</td> 
     </tr> 
</table> 
+0

Könnten Sie ein [minimales, vollständiges und überprüfbares Beispiel] (http://stackoverflow.com/help/mcve) bereitstellen? – lealceldeiro

+0

was meinst du mit ** datumstitel ** noch sichtbar? Können Sie Ihre Frage ausarbeiten? – Aravind

+0

@Aravind: Ich meinte, dass der Titel noch auf dem Bildschirm sichtbar ist, aber der Radio-Button ist richtig ausgeblendet – firstpostcommenter

Antwort

-1
<table ng-table="tableParam" 
    class="table table-striped table-hover table-bordered list-table" id="tableList" 
    fixed-header > 
     <tr ng-repeat="valuesList in $data"> 
      <td ng-if="role=='ADMIN'" data-title="'Select'"> 
        <input type="radio" name="selectRadio" ng-model="selectRadio" ng-value="valuesList" ></input> 
      </td> 
      <td ng-if="role=='ADMIN'" data-title="'Start Date'">{{valuesList.startDate}}</td> 
      <td ng-if="role=='ADMIN'" data-title="'End Date'">{{valuesList.endDate}}</td> 
     </tr> 
</table> 

Dies sollte den Trick. Wenn Sie hinzufügen möchten, nicht mehrere ng-if, dann wickeln Sie die <td> in einem <tbody> und gelten ng-if auf den <tbody>

+1

können Sie ein funktionierendes Beispiel zur Verfügung stellen! – Aravind

0

Ich habe versucht, das Problem mit dem plunkr neu zu erstellen, aber nicht in der Lage, neu zu erstellen, die Frage: http://plnkr.co/edit/xJgzQCXTwBMcS5dptpYN?p=preview

Möglicherweise ist etwas falsch in meiner Anwendung woanders, das ich nicht identifizieren konnte.

ich das Problem gelöst haben, die unter Lösung: (angewandte ng-wenn zu tr oder div-Tag usw. statt td)

<table ng-table="tableParam" 
     class="table table-striped table-hover table-bordered list-table" id="tableList" 
     fixed-header > 
      <tr ng-if="role=='ADMIN'" ng-repeat="valuesList in $data"> 
       <td data-title="'Select'"> 
         <input type="radio" name="selectRadio" ng-model="selectRadio" ng-value="valuesList" ></input> 
       </td> 
       <td data-title="'Start Date'">{{valuesList.startDate}}</td> 
       <td data-title="'End Date'">{{valuesList.endDate}}</td> 
      </tr> 
      <tr ng-if="role=='NOTADMIN'" ng-repeat="valuesList in $data"> 
       <td data-title="'Start Date'">{{valuesList.startDate}}</td> 
       <td data-title="'End Date'">{{valuesList.endDate}}</td> 
      </tr> 
    </table> 
0

Kurz gesagt kann man nicht. Weil der Header-Teil erstellt wurde, wenn die Tabelle initiert wird. Sie können dies jedoch tun:

<table ng-table="tableParam" class="table table-striped table-hover table-bordered list-table" id="tableList" fixed-header> 
    <thead> 
    <tr ng-repeat="valuesList in $data"> 
     <th ng-if="role=='ADMIN'">a</th> 
     <th>b</th> 
     <th>c</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="valuesList in $data"> 
     <td ng-if="role=='ADMIN'"> 
     <input type="radio" name="selectRadio" ng-model="selectRadio" ng-value="valuesList"></input> 
     </td> 
     <td>{{valuesList.b}}</td> 
     <td>{{valuesList.c}}</td> 
    </tr> 
    </tbody> 
</table>