在AngularUI的摺疊指令中使用條件語句

我可以在AngularUI的collapse指令中添加條件語句嗎？在AngularUI的摺疊指令中使用條件語句

我具有以下設置，其中有3無線電風格按鈕：

<div class="controls controls-row"> 
    <div class="btn-group" data-toggle="buttons-radio"> 
    <button type="button" class="btn" ng-model="radioPurpose" btn-radio="'meeting'">Meeting</button> 
    <button type="button" class="btn" ng-model="radioPurpose" btn-radio="'tour'">Tour</button> 
    <button type="button" class="btn" ng-model="radioPurpose" btn-radio="'other'">Other...</button> 
    </div> 
</div> 

<div class="controls controls-row"> 
    <textarea class="span6" placeholder="Why are you here?" ng-model="textPurpose" collapse="{{ radioPurpose == 'other' }}"></textarea> 
</div>

我想textarea根據radioPurpose按鈕的值顯示/隱藏。我知道該聲明在適當的時候對true進行了評估，但該指示始終顯示textarea。

來源

2013-05-09 Evil Closet Monkey

我沒有使用AngularUI，但我猜''崩潰'期待一個表達。刪除大括號：'collapse =「radioPurpose =='other'」' – Martin 2013-05-09 20:11:29

呃，我發誓我試過了......但我想不是。現在工作！ – 2013-05-09 20:27:25

p.s.，如果你把這個答案形式，我可以接受它。 – 2013-05-09 21:56:22

複製答案：

我沒有用過AngularUI，但我猜collapse預期的表現。刪除大括號：collapse="radioPurpose == 'other'"

來源

2013-05-10 06:57:54 Martin

摺疊實際上不是做簡單顯示/隱藏的最佳方式。摺疊項目的高度設置爲0，而不是設置爲display: none;它可能並不總是有你期待的效果。我會建議改爲使用ng-show或ng-hide。從評論

http://docs.angularjs.org/api/ng.directive:ngShow

來源

2013-05-09 21:13:12

在我的情況下，我也在尋找與崩潰相關的動畫。它是受控環境中受控平臺上的簡單應用程序，因此該解決方案適合我們的需求。 – 2013-05-09 21:55:48

我看到你解決了它，我也可以分享我的JSFiddle; Toggle Collapse with Radiobuttons。

但是，我明白了S McCrohan的意思，因爲我在我的應用程序中遇到問題。表格的摺疊無法在我的應用程序中完全運行，因爲它摺疊了，但可以看到頂部的一行。它似乎要求你分開的div，即與崩潰和div與跨班＃類div，如下：...

<!-- START CHART AREA --> 
    <div collapse="chartCollapsed"> 
     <div class="span12 well well-small"> 
      <div id="chart_div" style="width: 600px; height: 400px;"></div> 
     </div> 
    </div> 
    <!-- END CHART AREA --> 
    <!-- START TABLE AREA --> 
    <div collapse="tableCollapsed"> 
     <div class="span12"> 
           <!-- TABLE OMITTED --> 
     </div> 
    </div> 
    <!-- END TABLE AREA -->

來源

2013-07-23 08:17:09 Pixic

在AngularUI的摺疊指令中使用條件語句

回答

相關問題