How to get the parent DOM element reference of an angular2 component

Question

I need to access to some properties of the parent DOM element which contains the component from where i want to get the info, is there a way to do such thing?

Here i

Answer 1

for accessing values of parent you can use @input. for changing parent values try this example

child component

import { Component, EventEmitter, Input, Output } from '@angular/core';

@Component({
  selector: 'rio-counter',
  templateUrl: 'app/counter.component.html'
})
export class CounterComponent {
  @Input()  count = 0;
  @Output() result = new EventEmitter();

  increment() {
    this.count++;
    this.result.emit(this.count);
  }
}

child html part

  
Count: {{ count }}
  Increment

parent component

import { Component } from '@angular/core';

@Component({
  selector: 'rio-app',
  templateUrl: 'app/app.component.html'
})
export class AppComponent {
  num = 0;
  parentCount = 0;

  assignparentcount(val: number) {
    this.parentCount = val;
  }
}

parent html part

  Parent Num: {{ num }}

  Parent Count: {{ parentCount }}