小编Bas*_*ami的帖子

我在 Angular 2 中编写了一个可重用的组件，以Summernote在我的应用程序中显示所见即所得编辑器。该组件接受 3 个输入参数，这些参数被设置为呈现textarea为 id、name 和最后一个用作正文的属性。我的问题是，在这个组件中，我正在初始化 Summernote 插件并创建编辑器。在这里，我不想对选择器名称进行硬编码，而是希望将组件接收的动态值作为组件的输入参数。相关代码如下。

import {Component, ElementRef, OnInit, EventEmitter, Input, Output, Inject, ComponentRef} from '@angular/core';
import {Http} from '@angular/http';

declare var $: any;

@Component({
    selector: 'editor',
    template: `<textarea id="{{eid}}" name="{{ename}}" class="form-control">{{body}}</textarea>`
})

export class EditorComponent {

    @Input() body: string;
    @Input() eid: string;
    @Input() ename: string;
    @Output() onContentChanged: EventEmitter<any>;

    constructor(){}

    ngAfterViewInit()
    {
        $(document).on("pageLoaded", function (){
            console.log("pageLoaded");

                $("#body").summernote({
                    height: '200px',
                    callbacks: {
                        onChange: function(contents, $editable) {
                            $("#body").val(contents);
                        }
                    }
                }); …