2017-10-28 78 views
0

我正在使用angular和bootstrap。如何根據文本長度/存在性給出列寬

<div class="row"> 
<div class="col-xs-9"> someText1 </div> 
<div class="col-xs-3" *ngIf="somecondition"> someText2 </div> 
</div> 

兩個someText1,someText2取決於欲第一div來充分寬度如果未示出的第二個div的somecondition 。在這種情況下,someText1將成爲更長的文字因爲我們的業務規則。 我實現它使用

<div class="somecondition?col-xs-9:col-xs-12"> somevalue </div> 

但是,這是實現這一目標的正確的方式是否有任何引導的解決方案可能是某種拉動或自動調整

+0

是否

somevalue
工作? – Vega

回答

0

我寧願做這樣的:??

<div [ngClass]="someCondition? 'col-xs-9' : 'col-xs-12'">somevalue</div> 

<div [ngClass]=" {'col-xs-9' : someCondition, 'col-xs-12' : !someCondition}"> somevalue </div> 

或本:

<div *ngIf="someCondition; then temp1; else temp2"> </div> 

<ng-template #temp1> 
    <div class="col-xs-9"> 
    SomeText1 when someCondition = true 
    </div> 
</ng-template> 

<ng-template #temp2> 
    <div class="col-xs-12"> 
    SomeText1 when someCondition = false 
    </div> 
    <div>SomeText2</div> 
</ng-template> 

DEMO

+0

是啊..角度方法工作..我想知道是否有任何引導解決方案 – Jocket

相關問題