如何动态渲染角度标签元素

Question

我正在尝试在angular6中动态添加一个签名板，但是它呈现为字符串。

我想在此模板中获得一个签名板。

但是它变得空白。 Blank element image

// custom input fields for form builder
const fields = [{
  label: 'Signature Pad',
  attrs: {
    type: 'SignaturePad'
  },
  icon: 'S'
}];


const templates = {
  SignaturePad: function (fieldData) {
    return {
      // <span id="' + fieldData.name + '">
      field: `<ng-signature-pad (done)="showImage($event)"></ng-signature-pad>`,
      onRender: function () {
      }
    };
  }
};


@Component({
  selector: 'app-test-form-builder',
  templateUrl: './test-form-builder.component.html',
  styleUrls: ['./test-form-builder.component.css']
})
export class TestFormBuilderComponent implements OnInit {

  formBuilder: any;
  title = 'Template builder';

  ngOnInit(): void {
    this.formBuilder = ($('.build-wrap')).formBuilder({ formData, templates, fields });
    console.log(this.formBuilder);
  }
}

呈现为与字符串相同的字符串。

<ng-signature-pad (done)="showImage($event)"></ng-signature-pad>