2

I am not able to access Table Row of Data in Angular 2 Application,using Element Ref and query Selector.

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

Above Code shows Data with tbody and child tr.

However,when I use

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

The Result is Coming As Null or Blank Array.[]

Avinash
  • 313
  • 1
  • 5
  • 14
  • 1
    What do you want to select with `tbody tr` ? If all `tr`s under `tbody` then ``s might not have been present by the time you call this command. Try to setTimeout in like 5-6 seconds to test it. – eko Jan 07 '17 at 20:52
  • querySelectorAll returns a NodeList array. If you need only the first child get the first element of this list, if it exists, like querySelectorAll("tbody tr")[0] – gaetanoM Jan 07 '17 at 20:54
  • @echonax....Even I am thinking the same and set TimeOut does Resolve the Issue,but It delays Other things mid way.Is there any Other functionality you are Aware of in Angular 2 which can help me getting Thing done in a smoother way. – Avinash Jan 07 '17 at 21:47
  • @user3856563 where do you inject ``s? Is it with an ngFor? What is the use case? – eko Jan 08 '17 at 10:03
  • @echonax...yes....my tr is in inline with ngFor. – Avinash Jan 08 '17 at 10:09
  • These might help:http://stackoverflow.com/questions/35819264/angular-2-callback-when-ngfor-has-finished, http://stackoverflow.com/questions/36482343/angular-2-fire-event-after-ngfor – eko Jan 08 '17 at 18:06

1 Answers1

0

There is difference between querySelector and querySelectorAll.

Where querySelector works for you is because it returns DOM ( as you said data was returned ).

But with querySelctorAll you will get Node list. So, try to iterate trough that list and you will get table rows.

e1.forEach(tr => console.log(tr));
Haris Hajdarevic
  • 1,535
  • 2
  • 25
  • 39
  • @haris...Tried the same but getting tbody in the response.I think the Issue is with rendering of DOM,which is taking time. But I am not able to figure out how to resolve that, – Avinash Jan 07 '17 at 21:45