Wie kann ich einen Zellenspalte auf einen bedingten Wert mit eckigen basieren?

Question

Basierend auf einem Wert an anderer Stelle auf der HTML-Seite brauche ich eine Zeile innerhalb einer Tabelle, um mehr Zellen als sonst überall in der Tabelle anzuzeigen. Um die Ausrichtung korrekt und sauber zu halten, suche ich nach einer Möglichkeit, den Spaltenbereich einer Zelle dynamisch zu setzen. Ich kann einfach nicht funktionieren.

<input type="checkbox" ng-model="vm.noInventory"/> 

<table> 
    <th> 
    <td>Product</td> 
    <td colspan={{vm.noInventory ? '2' : '1'}}>Inventory<td> 
    <td ng-show="vm.noInventory"></td> 
    </tr> 
    <tr> 
    <td>Product B</td> 
    <td>55 parts</td> 
    <td ng-show="vm.noInventory">Backordered</td>  
    </tr> 

</table> 

Answer 1

die Lösung gefunden ... Ich hatte eigentlich einen Tippfehler und benötigt „in der colspan um“ ...

<td colspan="{{vm.noInventory ? '2' : '1'}}">Inventory<td> 

Answer 2

Eine andere Methode, wenn Sie mit der Einstellung colspan durch CSS sind ok wäre Verwenden Sie ng-style und definieren Sie eine Funktion, die ein Objekt zurückgibt, das dem von Ihnen inline angegebenen ähnelt.

Zum Beispiel können Sie den ng-Stil Direktive zum TD-Elemente wie unten hinzufügen könnten:

<td ng-style=vm.colWidth(vm.noInventory)>Inventory<td> 

Und in Ihrem JS:

vm.colWidth = function(noInv) { 
    return {"colspan": noInv ? '2' : '1' }; 
};