如何使用角度2將組件注入到組件2

Question

我想注入一些html到我的組件（Angular 2）中，我用angularjs中的$ compile將html注入DOM，因爲在我注入的html中我有一個方法犯規執行繼承人的代碼：

addTextField(){ 
    var newTextBoxDiv = $(document.createElement('div')) 
    .attr("id", 'TextBoxDiv' + this.counter); 

     newTextBoxDiv.after().html('<label>Textbox #'+ this.counter + ' : </label>' + 
    '<input type="text" name="textbox' + this.counter + 
    '" id="textbox' + this.counter + '" value="" >'+'<span 
    (click)="removeTextField(this.counter)" class="glyphicon glyphicon-remove pull- 
    right" style="z-index:33;cursor: pointer"> </span>'); 
    newTextBoxDiv.appendTo("#TextBoxesGroup"); 
} 

removeTextField功能：

removeTextField(currentTextField){ 
    alert(currentTextField); 
} 

當我嘗試dyanamically添加一個文本框它刪除跨度是我的意思是（點擊）=「removeTextField（this.counter ）「，如代碼中提到的，但是當我嘗試點擊這個跨度時，它的執行沒有什麼功能並沒有解僱..任何幫助請

Answer 1

在這裏，我們給templateUrl HTML將從給定的路徑得到。

import {Component, OnInit} from '@angular/core'; 
    import { FormControl, FormGroup , Validators} from '@angular/forms'; 
    import { FormsModule, ReactiveFormsModule } from '@angular/forms'; 
    import {HttpClient} from '@angular/common/http'; 

    @Component({ 
     selector: 'app-root', 
     templateUrl: './app.component.html', 
     styleUrls: ['./app.component.css'] 
    }) 
    export class AppComponent implements OnInit { 
    results:any; 
    constructor(private http: HttpClient){} 

    images: any[]; 

     ngOnInit() { 

     this.http.get('https://restcountries.eu/rest/v2/all').subscribe(data => { 
     debugger; 
      // Read the result field from the JSON response. 
      this.results = data; 
     }); 

     } 


    }