1

I have a component that will generate some HTML and same it to a variable. I can display it OK on my template where it needs to go, but my (click) function is not working on the HTML. What is the best way to get this working?

I have it working like this, but is this the correct way to do it?

import { Component, OnInit, ViewChild, AfterContentInit, Renderer2 } from '@angular/core';

  ngAfterContentInit() {
    const global = this.renderer.listen('document', 'click', (event) => {
      const element = event.target as HTMLElement;
      if (element.classList.contains('navbox-title') || element.classList.contains('wrap-title')) {
        const nodeId = event.target.dataset.nodeid;
        this.gotoNode(nodeId);
      }
    });
  }
  
  
  myFunction () {
    this.dispHtml = '<div data-nodeId="${value.id}" class="navbox-title">'.....;
  }
K.Dᴀᴠɪs
  • 9,945
  • 11
  • 33
  • 43
Ennio
  • 1,147
  • 2
  • 17
  • 34
  • not put the (click) event in the ts string ... remove the click and use ViewChild instead ... see this ... https://namitamalik.github.io/ViewChild-in-Angular2/ – Araz Shamsaddinlouy Jul 28 '17 at 13:40
  • possible duplicate of https://stackoverflow.com/questions/45337908/attaching-directives-to-dynamically-added-elements – Vega Jul 28 '17 at 16:09

0 Answers0