使用條件打開手風琴

目前我有一個文本字段，可以在其中過濾手風琴標題的內容以及內容。當我打字時，我會喜歡它，如果有巧合，手風琴將會擴展，但是巧合的是手風琴應該關閉。我該怎麼做？使用條件打開手風琴

<input type="text" placeholder="Search" ng-model="search.pregunta"> 
<uib-accordion close-others="true"> 
<div ng-repeat="faq in faqs | filter: search.pregunta"> 
    <div class="col-sm-11" > 
     <div uib-accordion-group class="panel-default" is-open="faq.open"> 
      <uib-accordion-heading > 
       <span ng-click="ignoreClick($event);" ><a href='' click-to-edit item="faq" ng-model='faq.pregunta' typeinput='textarea' >{{faq.pregunta}}</a></span> <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': faq.open, 'glyphicon-chevron-right': !faq.open}"></i> 
      </uib-accordion-heading> 
      <span click-to-edit item="faq" ng-model="faq.respuesta" >{{faq.respuesta}}</span> 
     </div> 
    </div> 
    </div> 
</ui/div> 
    </div> 
</uib-accordion>

我有一個錯誤，當我與is-open="search.pregunta?true:false"替換is-open="faq.open"與ng-class="{'glyphicon-chevron-down': search.pregunta, 'glyphicon-chevron-right': !search.pregunta}"取代ng-class="{'glyphicon-chevron-down': faq.open, 'glyphicon-chevron-right': !faq.open}"。

我基本上是確定搜索文本是否爲空的展開/摺疊狀態。

來源

2017-05-31 yavg

如果我總結一下，你想要的以下行爲：

手風琴組頭相匹配的search.pregunta - >打開
手風琴組頭不匹配search.pregunta - > CLOSED

如果是的話，你應該嘗試：

https://jsfiddle.net/rtd6v41L/

<input type="text" placeholder="Search" ng-model="search.pregunta"> 
     <uib-accordion close-others="true"> 
      <div ng-repeat="faq in faqs"> 
       <div class="col-sm-11" > 
       <div uib-accordion-group class="panel-default" is-open="faq.pregunta.indexOf(search.pregunta) !== -1"> 
        <uib-accordion-heading> 
         <span ng-click="ignoreClick($event);"> 
         <a href='' click-to-edit item="faq" ng-model='faq.pregunta' typeinput='textarea' > 
          {{faq.pregunta}} 
         </a> 
         </span> 
         <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': faq.pregunta.indexOf(search.pregunta) !== -1, 'glyphicon-chevron-right': faq.pregunta.indexOf(search.pregunta) === -1}"></i> 
        </uib-accordion-heading> 
        <span click-to-edit item="faq" ng-model="faq.respuesta" >{{faq.respuesta}}</span> 
       </div> 
      </div> 
     </div> 
    </uib-accordion>

這樣，每個手風琴的打開/關閉鏈接到搜索領域。

我希望它有幫助。

來源

2017-05-31 14:42:26

非常感謝，但我看到一個問題，我無法直接從箭頭擴展手風琴。另一個問題是，當我刪除內容或不寫任何內容時，我需要它，和絃最終關閉。 – yavg

看看開發者控制檯，並且當我查找某個項目時，我總是遇到錯誤。 – yavg

是的，這是我實施的一個限制。實際上，如果您想要手動打開/關閉（通過單擊箭頭），您必須管理2種模式，以根據搜索+箭頭上的點擊歷史記錄確定是否應打開或關閉某個手風琴。在這種情況下，您應該在您的控制器中創建方法並像這樣使用它：is-open =「isOpen（faq.pregunta）」。您可以自由選擇在功能中做什麼，並處理更復雜的情況。 –

使用條件打開手風琴

回答

相關問題