1

次のようにいくつかのボタンを表示および非表示にしようとしてEmber.jsいます。

{{#view App.myView contentBinding="App.myObject"}

<div id="my_widget" class="well span3">                                                                                 
{{#if content.isConditionTrue}}                                         
  <button id="stop_button" class="btn btn-primary"> Stop </button>                                              
  <button id="start_button" class="btn btn-primary" > Start </button>
  <button id="record_button" class="btn btn-primary">Record </button>
</div>                                            
{{else}}                                            
  <div id="widget_warning_box" class="well">                                                  
    <p> No cameras are open, open a camera in Add/Remove Cameras tab. </p>                                          
  </div>
{{/if}}                                         
</div>
{{/view}}

ビューは次のようになります。

App.myView = Ember.View.Extend({
   didInsertElement: function() {
      $record = $("#record_button")
      $start = $("#start_button")
      $stop = $("#stop_button")

      $record.click(function(){
           console.log("record clicked")
           });

      $start.click(function(){
           console.log("start clicked")
           });
   });

そして、myObjectコントローラーは

  App.myObject = Ember.Object.create({
      isConditionTrue : false;
  });

この種の動作（ボタンは、の場合myObject.isConditionTrueはテキストに置き換えられ、の場合は表示されます）ですが、ボタンが表示されている場合、クリックしても機能しません。didInsertElementが呼び出されたときにそれらがDOMにないためだと思います。それで、これを修正する方法はありますか？子/親ビューの設定を行う必要がありますか？どんなポインタでもありがたいです。falseisCondionTruetrue

4

1 に答える 1

2

私はエンバーも学んでいるので、これを行う正しい方法が何であるかを確実に伝えることができる人ではありませんが、フィドルに関する私の作業アプローチは次のとおりです

http://jsfiddle.net/drulia/zkPQt/

基本的に、に切り替えるたびmyObject.isConditionTrueにfalse、ember はボタンを DOM から削除します。そのため、jQuery セレクターが機能しなくなります。ember js {{action}} ヘルパーをアタッチし、myObject のイベントに応答する関数を配置しました。これで、ボタンが機能し、アクションの結果が画面に表示されます。

于 2013-01-28T02:34:37.897 に答える