jQuery handsontable with angularjs 지시문

Question

각도 지시어로 jQuery handsontable을 사용하려고합니다. 그러나 셀에 무언가를 입력하면 지시문이 이상한 방식으로 동작하여 입력 된 문자가 테이블 외부에 나타납니다. 이것은 각도 지시자가 아닌 각도 컨트롤러 내부에서 핸즈프리를 초기화 할 때 발생하지 않습니다.

여기 jsfiddle

을 Heres의 handsontable 초기화 코드입니다.

$(element).handsontable({ 
    data: $scope.data, 
    columns: [{data: 'name'}, {data: 'age'}]     
})  

아무도 모르게됩니다.

Answer 1

div에 핸즈프리가 필요해 보이는 것 같습니다. 사실 지시어에 :

한 가지 해결책은 교체 추가하는 또 다른 방법은 속성에 지시문을 제한에서 마크 업을 변경하는 것입니다 Demo

myApp.directive('handsontable', function(){ 
    return { 
     restrict: 'E', 
     scope: { 
      data: '=' 
     }, 
     replace: true, 
     template: "<div></div>", 
     link: function(scope, elem, attrs){ 
      $(elem).handsontable({ 
       data: scope.data, 
       columns: [{data: 'name'}, {data: 'age'}]     
      }) 
     } 
    } 
}) 

handsontablediv :

<div handsontable data="data"></div> 

Demo

Answer 2

이 문제가 템플릿과 사업부에 관련되어 보인다. 내가 대신이 구성을 사용 handsometable 통합
는 : jsfiddle

<div handsometable></div> 

myApp.directive('handsometable', function() { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attrs) { 
      var data = scope.data 
      $(element).handsontable({ 
       data: data, 
       colHeaders: ["Name", "Age"], 
       rowHeaders: true 
      }); 
     } 
    }; 
})