Jquery를 발생시키는 방법 각도 4의 Datatable 하위 컨트롤 이벤트

Question

Angular 4 프로젝트에 JQuery Datable을 사용하고 있습니다. 데이터가 올바르게 표시됩니다 .Edit 버튼 이벤트가 제대로 실행되지 않습니다.

나는 "

0x800a1391 스크립트 블록 라인 3에서 처리되지 않은 예외, 1 열 - 자바 스크립트 런타임 오류 : 'onEditClick'정의되지 않은"오류가 무엇입니까 편집 버튼을 클릭하는 동안

합니다. . 널 :

this.http.get (this.appService.baseUrl + 'API/ServiceType 자리') 가입 (결과 => {

 this.serviceTypes = result.json() as IServiceTypeSummary[]; 

     //$(".log-data-table").DataTable(); 

     $(".log-data-table").DataTable({ 

      "data": this.serviceTypes, 

      scrollY: "500px", 

      destroy: true, 

      scrollX: true, 

      scrollCollapse: true, 

      autoWidth: true, 

      paging: true, 

      "columns": [ 

       { data: "serviceTypeId" }, 

       { data: "name"}, 

       { data: "status" }, 


       { 

데이터 참조 코드 아래를보십시오 , 주문할 수 : 사실, "이름": "COLUMNNAME"

렌더링 : 기능 (데이터 입력, 행) {

     return '<a class="btn btn-primary" 

onclick = "onEditClick (data);"> 편집 ';

    } 

       } 


      ] 

     }); 

    }, error => console.error(error)); 


} 

onEditClick(data): void { 

    alert(data); 

} 

Answer 1

정상입니다. 당신은 그렇지 않으면 작동하지 않습니다 화살표 기능을 사용해야합니다. 설명하겠습니다. 귀하의 JQueryDataTable 귀하의 typescript 기능에 대해 아무것도 몰라. 따라서 화살표 함수를 사용하면 호출 된 함수가 있음을 알 수 있습니다. 그래서 코드는

render: (data, type, row) => { 
    return '<a class="btn btn-primary" onclick="onEditClick(data);">Edit </a>'; 
} 

해야하지만 어쨌든 그냥 시도를 포기하고 저희에게 알려, 확인 기능이 트리거됩니다 아닙니다. 가장 좋은 방법은 버튼 클릭시 onEditClick()을 트리거하는 함수를 만드는 것입니다. 버튼에 클래스 이름을 추가하고 jQuery를 사용하여 함수를 트리거 할 수 있습니다. 이미 한 번 해봤는데 여기 jQuery를 사용하여 어떻게 만들었습니까?

render: (data, type, row) => { 
return '<a class="btn btn-primary edit-button" >Edit </a>'; 
} 

ngOnInit(){ 
this.triggerUpdate() 
} 

triggerUpdate(){ 
jQuery("table#datatableTag").on('click', 'a.edit-button', (evt) => { 
    var row = jQuery(evt.currentTarget).closest('tr'); 
    var data = jQuery('table#datatableTag').dataTable().fnGetData(row); 
    this.onEditClick(data); 
}) 
}