swapp1990
swapp1990

Reputation: 454

How to get html template of an Angular 2 Component?

I have a simple angular 2 component:

@Component({
  selector: 'test-text',
  template: `<p> Text </p>`
})
export class TestComponent {
  constructor() {}      
  getHtmlContent() {return;} //This should return '<p> Text </p>' as a string
}

What is the simplest way I can the html content for my Component back?

Upvotes: 12

Views: 29411

Answers (1)

tjoskar
tjoskar

Reputation: 443

You can use ElementRef. E.g.

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

@Component({
  selector: 'test-text',
  template: `<p> Text </p>`
})
export class TestComponent {
  elRef: ElementRef

  constructor(elRef: ElementRef) {
    this.elRef = elRef;
  }      

  getHtmlContent() {
    //This will return '<p> Text </p>' as a string
    return this.elRef.nativeElement.innerHTML;
  }
}

Upvotes: 17

Related Questions