2017-01-07 10 views
2

Element Refとクエリセレクタを使用して、Angular 2アプリケーションでTable Rowのデータにアクセスすることができません。tbodyの子コンポーネントを取得する

ngAfterViewInit(){ 
      var e1 = this._elementRef.nativeElement.querySelector("tbody"); 
         console.log(e1); 
       e1.draggable="true"; 
    } 

上記のコードは、tbodyとchild trのデータを示しています。しかしながら

、私は結果としてヌルまたはダミーアレイ来ている。[]

ngAfterViewInit(){ 
      var e1 = this._elementRef.nativeElement.querySelectorAll("tbody tr"); 
         console.log(e1); 
       e1.draggable="true"; 
    } 

を使用

+1

「tbody tr」で何を選択しますか? 'tbody'の下に' tr'があると、このコマンドを呼び出すまでに ''が存在しない可能性があります。テストするには5〜6秒でsetTimeoutを試してください。 – echonax

+0

querySelectorAllはNodeList配列を返します。最初の子だけが必要な場合は、querySelectorAll( "tbody tr")[0] – gaetanoM

+0

@echonaxのように、このリストの最初の要素があればそれを取得します。同じように考えてTimeOutを設定しても問題は解決しますしかし、それは途中で他のことを遅らせます。角度2であなたが気づいている他の機能があります。私はそれをよりスムーズにするために役立ちます。 – user3856563

答えて

0

querySelectorquerySelectorAll差があります。

ここではquerySelectorがあなたのために働くのは、DOMが返されるからです(データが返されたとします)。

しかし、querySelctorAllを使用すると、ノードリストが表示されます。だから、そのリストを繰り返すとテーブルの行が得られます。

e1.forEach(tr => console.log(tr)); 
+0

@haris ...同じことを試みましたが、応答でtbodyを取得しました。問題はDOMのレンダリングと考えられます。これは時間がかかります。 しかし、私はそれを解決する方法を理解することができませんが、 – user3856563

関連する問題