クリック機能は、実行時に私のコンポーネントの内部angular2

Question

私が作成していますボタンを動作していないと（クリック）イベントを聴いていない

app.component.ts

 createButton() { 
      '<div style="width: 200px; height: 100px;overflow: hidden">' + 
       '<strong>' + line.title + '</strong>' + 
       ' <ul style=" margin: 8px 0 0;">' + 
       ' <li><span style="background: url(../../../../../assets/app-icons/arrow-popup.png) no-repeat; width: 100%;height: 100%;background-size: 32%;padding: 0px 11px 13px 30px;">' + line.milage + '</span></li>' + 
       ' <li><span style="background: url(../../../../../assets/app-icons/view-popup.png) no-repeat;width: 100%;height: 100%;background-size: 18%;padding: 0px 11px 13px 30px;">KMZ (web)</span></li>' + 
       '</ul>' + 
       '<button role="button" (click)="viewCircuit()" style=" color: #18377C;font-size: 14px;display: block;text-align: right;">View</button>' + 
       '</div>' 
     } 

    viewCircuit() { 
      console.log('data') 

    } 

Answer 1

<button (click)="myFunc()"></button> 

import { Component, OnInit } from "@angular/core"; 

@Component({ 
    templateUrl:"button.html" //this is the component which has the above button html 
}) 

export class App implements OnInit{ 
    constructor(){} 

    ngOnInit(){ 

    } 

    myFunc(){ 
    console.log("function called"); 
    } 
}