3

I am a newbie on Angular2, I have to get the next element value/text in Angular2 but I am not able to do so. It is very easy in Jquery but I didnt find any way to achieve the same in Angular2. Please help.

Here is my code:

<div id="div1">Here is Div-1 content</div>
<div id="div2">Here is Div-2 content</div>

In jquery it is very easy to do like:

$('#div1').next().text();

How the same can be done in Angular 2

Christopher Moore
  • 3,071
  • 4
  • 30
  • 46
Ankit
  • 292
  • 1
  • 6
  • 17
  • Possible duplicate of [Where does DOM manipulation belong in Angular 2?](https://stackoverflow.com/questions/37376442/where-does-dom-manipulation-belong-in-angular-2) – asmmahmud Oct 10 '17 at 15:32
  • 1
    no, it is not. My question is something different. – Ankit Oct 10 '17 at 15:59
  • Similar to https://stackoverflow.com/questions/32693061/angular-2-typescript-get-hold-of-an-element-in-the-template?noredirect=1&lq=1 – asmmahmud Oct 10 '17 at 16:00

2 Answers2

3

You can use element reference and use that same way you do in jQuery.

Inject the element reference to your component

  constructor(private elementRef: ElementRef) {

  }

Then use query selector

this.elementRef.nativeElement.querySelector('.div1').style.display = 'none';
Aniruddha Das
  • 20,520
  • 23
  • 96
  • 132
  • yes this can give me what I want but I m wandering for any other way. Is there any other way? – Ankit Oct 10 '17 at 14:53
  • @ViewChild is also there but not sure and not tried. you can look into that too. You can also bind some component variable to the tag as well. i think there are other ways as well. – Aniruddha Das Oct 10 '17 at 15:03
3

I think what you are looking for is not angular specific thing, but at least in javascript you can do this: document.getElementById('div1').nextSibling where you can find the properties of said element. And you can increment index to find next siblings after or check for children, so on and so forth.

You can read about implementation here on MDN.

Hope this helps. :)

Krister Torsvik
  • 82
  • 3