Question

我想在我的组件中注入一些html（Angular 2），我曾经在angularjs中使用$ compile将html注入到DOM中，因为在我注入的html中我有一个方法并不执行heres代码：

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);
}

当我尝试添加一个文本字段时，它有一个删除范围，我的意思是（click）=“removeTextField（this.counter）”，如代码中所述，但问题是当我试图点击这个跨越它的执行没有任何功能没有解雇..请帮助

Answer 1

这里我们给出了将从给定路径获取HTML的templateUrl。

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;
        });

        }


    }

如何使用angular 2

1 个答案: