如何在emberjs視圖上運行自定義JavaScript？

Question

我在emberjs新的，我要實現我的車把emberjs觀點hansontable，我的看法代碼如下

<script type="text/x-handlebars" data-template-name="clex/sc"> 
    <div id="spread-sheet" style="width: 100%;"></div> 
</script> 

目前我安裝hansontable通過使用文檔準備功能JavaScript來#spread_sheet DIV給出，例如給出下面

<script>$(document).ready(function() { 

    var data = [[""]], spread_sheet = $("#spread_sheet"); 

    var validateDate = /^[0-9]{2}-[0-9]{2}-[0-9]{4}$/; // mm-dd-yyyy 

    spread_sheet.handsontable({ 
     autoWrapCol: true, 
     autoWrapRow: true, 
     columns: [ 
      {data: 0}, 
      {data: 1, validator: validateDate}, 
      {data: 2}, 
      {data: 3}, 
      {data: 4}, 
      {data: 5, validator: validateDate}, 
      {data: 6}, 
      {data: 7, validator: validateDate}, 
      {data: 8}, 
      {data: 9}, 
      {data: 10}, 
      {data: 11}, 
      {data: 12}, 
      {data: 13}, 
      {data: 14} 
     ], 
     colWidths: window.innerWidth*.12, 
     contextMenu: true, 
     currentRowClassName: "row_selected", 
     data: data, 
     fixedColumnsLeft: 1, 
     height: window.innerHeight - 32, 
     manualColumnMove: true, 
     manualColumnResize: true, 
     minSpareCols: 2, 
     minSpareRows: 80, 
     outsideClickDeselects: false, 
     persistentState: true, 
     rowHeaders: true, 
     stretchH: "last", 
     width: window.innerWidth 
    }); ... 

，但它不與emberjs車把模板

我要實現它emberjs，但我不知道如何在車把模板添加這項工作？ 當我嘗試爲條形圖實現d3js時，我感到同樣的問題？

我可以使用視圖對象的「didInsert」嗎？

Answer 1

是的，它可以基於didInsertElement事件完成。

實施例，

App = Ember.Application.create(); 

App.IndexView = Ember.View.extend({ 
    createGrid:function(){ 

    var data = [ 
    ["", "Maserati", "Mazda", "Mercedes", "Mini", "Mitsubishi"], 
    ["2009", 0, 2941, 4303, 354, 5814], 
    ["2010", 5, 2905, 2867, 412, 5284], 
    ["2011", 4, 2517, 4822, 552, 6127], 
    ["2012", 2, 2422, 5399, 776, 4151] 
]; 

this.$('#spread-sheet').handsontable({ 
    data: data, 
    minSpareRows: 1, 
    colHeaders: true, 
    contextMenu: true 
}); 

    }.on("didInsertElement") 
}); 

http://emberjs.jsbin.com/duzebeku/1/edit

也爲d3.js條形圖相同的概念，

http://emberjs.jsbin.com/liteqevu/1/edit

P.S. op代碼上的id也應該是#spread-sheet而不是#spread_sheet