Javascript 当onclick功能不在按钮中时，ng2引导模式无法关闭

我正在尝试实现一个包含项目列表的页面。单击每个项目，将触发ng2引导模式，以显示项目的详细信息。但当我尝试在按钮外使用（单击）=“lgModal.show（）”时，发现了一个问题。无法通过在覆盖层外单击或单击小x（十字）按钮来关闭模式。关闭模式的唯一方法是按“退出”键。 以下是代码示例：

<li (click)="lgModal.show()" *ngFor="let item of Items"> {{ item }}
    <div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" (click)="lgModal.hide()" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">Large modal</h4>
                </div>
                <div class="modal-body">
                    ...
                </div>
            </div>
        </div>
    </div>
</li>

{{item}
&时代；
大模态
...

有没有一种方法，我可以摆脱这个按钮和移动（onclick）以外的按钮。

---

大模态

您需要添加

数据消除

属性

替换

<button type="button" class="close" (click)="lgModal.hide()" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>\

&时代；
\

与

&时代；

它对我不起作用。。。仍然无法关闭模式。您可以为此制作plunkr或JSFIDLE吗？

<button type="button" class="close" (click)="lgModal.hide()" aria-label="Close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                    </button>