2017-03-19 7 views
0

角2クリックのマイページは基本的に2つの部分に分割された要素

<div *ngIf="initState"> 
    <div class="ui accordion"> 
    <div class="title"> 
     <i class="dropdown icon"></i> 
     Title 
    </div> 
    <div class="content"> 
    {{ someText }} 
    </div> 
    </div> 
    <button class="ui button" (click)="notInitialAnymore();">Click</button> 
</div> 
<div *ngIf="!initState"> 
    <div class="ui accordion"> 
    <div class="title"> 
     <i class="dropdown icon"></i> 
     Another title 
    </div> 
    <div class="content"> 
    {{ someOtherText }} 
    </div> 
    </div> 
</div> 

ポイントがinitalStateでアコーディオンが正常に動作していることですが、初期状態ではないではない - に無反応その要素をクリックします。私の場合、回避策は簡単ですが、回避策を講じないとどうしたらいいですか?どのように私は2番目のアコーディオンコールすることができます:

<script language='javascript'> 
    $(document).ready(function(){ 
     $('.ui.accordion').accordion(); 
    }); 
</script> 
+0

最初のアコーディオンはどのように開いていますか – Aravind

答えて

0

使用[隠さ]属性、jQueryのは、その上にアコーディオンを初期化することはできませんので、要素がDOMに作成されていないngIfあなたは*を使用します。

<div [hidden]="!initState"> 
    <div class="ui accordion"> 
    <div class="title"> 
     <i class="dropdown icon"></i> 
     Title 
    </div> 
    <div class="content"> 
    {{ someText }} 
    </div> 
    </div> 
    <button class="ui button" (click)="notInitialAnymore();">Click</button> 
</div> 
<div [hidden]="initState"> 
    <div class="ui accordion"> 
    <div class="title"> 
     <i class="dropdown icon"></i> 
     Another title 
    </div> 
    <div class="content"> 
    {{ someOtherText }} 
    </div> 
    </div> 
</div> 
関連する問題