Question

我正在尝试将jquery引导程序popover插入到角度2指令中。我只是无法关闭十字按钮上的弹出窗口。

@Directive({
    selector: '[popover]',
    host: {
    }
})
export class PopOverDirective {

    @Input() type: string;

    constructor(private element : ElementRef) {}

    ngAfterViewInit() {
       var self = this;

     (<any>$(this.element.nativeElement)).popover({
            placement: 'right',
            html: 'true',
            trigger: 'manual',
            title: '<span class="text-info"><strong>title</strong></span>' +
            '<button type="button" id="close" class="close" onclick="$(self.element.nativeElement).popover(&quot;hide&quot;);">&times;</button>',
            content: 'test'
        }).click(function (e) {
            (<any>$(self.element.nativeElement)).popover('show');
        });


    }
}

关闭按钮onclick事件的代码肯定不起作用。我不知道如何获取jquery对象。我怎么能做到这一点？

Answer 1

尝试resources\android\icon\drawable-hdpi-icon.png：

on

希望这会奏效。

<强>更新

正在使用.on('click', () => nativeElement.popover('show'));代码：

Directive

在import { Directive, ElementRef, AfterViewChecked } from '@angular/core'; const $ = require('jquery'); @Directive({ selector: '[popover]' }) export class PopOver implements AfterViewChecked { constructor(public el: ElementRef) { } ngAfterViewChecked(): void { const popoverElement: any = $(this.el.nativeElement); popoverElement.popover({ }); } }：

component

在模板中：

this.popoverText = `
    <div id='popover-content' class='popover-display'>
        <div class='popover-text'>My popover text</div>
    </div>`;

    }

结帐。

使用jquery bootstrap popover的popover指令

1 个答案: