angular2의 테이블 트리

Question

jquery-treegrid를 사용하여 2 각도의 트리 테이블을 만들려고합니다. 1. package.json에 jquery-treegrid 종속성을 추가했습니다. 2. 타이프 라이터의 jQuery 라이브러리를 설치

<table class="tree"> 
    <tr class="treegrid-1"> 
     <td>Root node</td><td>Additional info</td> 
    </tr> 
    <tr class="treegrid-2 treegrid-parent-1"> 
     <td>Node 1-1</td><td>Additional info</td> 
    </tr> 
    <tr class="treegrid-3 treegrid-parent-1"> 
     <td>Node 1-2</td><td>Additional info</td> 
    </tr> 
    <tr class="treegrid-4 treegrid-parent-3"> 
     <td>Node 1-2-1</td><td>Additional info</td> 
    </tr> 
    </table> 

내 구성 요소 클래스 : 콘솔에서

declare var jQuery:any; 
@Component({ 
    selector: '[configuration]', 
    template: require('./configuration.html'), 
    encapsulation: ViewEncapsulation.None, 
    styles: [require('./configuration.scss')], 
    directives: [Widget, TablesBackgrid, DataTableDirectives], 
    providers: [ConfigurationService, 
       HTTP_PROVIDERS], 
    pipes: [SearchPipe] 
}) 
export class Configuration implements AfterViewInit, OnInit { 
    data: ISystem[]; 
    errorMessage: string; 

    constructor(private configurationService: ConfigurationService, private rootNode: ElementRef) { 
    } 

    ngAfterViewInit() { 
    jQuery(this.rootNode.nativeElement.find('.tree')[0]).treegrid(); 
    } 

    ngOnInit(): void { 
    this.configurationService.getSystems() 
     .subscribe(systems => this.data = systems, 
     error => this.errorMessage = <any>error); 
    } 

} 

오류 : TSD는 JQuery와에게 3. 추가 HTML 코드를 설치 내가 다음

TypeError: this.rootNode.nativeElement.find is not a function 

이 포럼에 대한 답변은 제대로 작동하지 않았습니다. angular2에서 테이블 트리를 실행하는 다른 플러그인이 있습니까?

Answer 1

내가 그것을

jQuery(this.rootNode.nativeElement).find('.tree')[0].treegrid(); 

해야한다 생각

Answer 2

예 코드에 문제가 있습니다 () 이동). jQuery 메서드를 DOM 요소에 바인딩하려고합니다.이 메서드는 사용할 수 없지만 jQuery 개체에는 사용할 수 없습니다. 대신, 당신은 당신의 jQuery TreeGrid에를 사용하는 언급 한 바와 같이

jQuery(this.rootNode.nativeElement).find('.tree').first().treegrid(); 

그리고 난 당신이 그것을 다시 DOM 요소에 JQ 객체로 변환하기 때문에 [0]을 제거 할 필요가 그래서는 jQuery를 객체를 필요로 suppost : 그래서, 당신이 변경할 수 있습니다 .first()을 사용하여 .tree 클래스의 첫 번째 요소를 가져올 수 있습니다.