引导弹出框内的角元素答案

【问题标题】：Angular element inside bootstrap popover引导弹出框内的角元素
【发布时间】：2017-08-22 14:44:38
【问题描述】：

我正在使用带有角度 2 的 Bootstrap，我的角度（点击）在我的弹出框内容中不起作用。

HTML：

 <p id="myPopover-profile">Operator</p>

    <div class="profile-option" id="profile-option">
      <div class="user-name"> Jhone Doe</div>
      <div class="line"> </div>
      <div class="end-session" (click)="endSession()"> End Session </div>
      <div class="logout"> Logout </div>
    </div>

</div>

TS：

  ngOnInit() {
    $('#myPopover-profile').popover({
      placement: 'bottom',
      toggle: 'popover',
      html: true,
      content:  function() {
        return $('#profile-option').html();
      }
    });

  }

  endSession(){
    console.log("test");
  }

【问题讨论】：

你的 html 声明在哪里？
ng-bootstrap.github.io/#/components/popover/api
不不不。停止。停止使用 Angular 和 jQuery。使用 Angular 或 jQuery，不要同时使用。他们是竞争对手，有完全不同的方法。 Angular 生成 DOM，jQuery 操作它。以 Angular 方式或 jQuery 方式做事。你只是在笨拙地混合东西并加载两个库而不是一个。

标签： javascript jquery twitter-bootstrap angular typescript

【解决方案1】：

为什么你不为你的弹出框创建一个组件，在弹出框 html 中你做类似<my-component></my-component> 的事情，因此你可以使用 myComponent.ts 文件来拥有你想要的逻辑。

【讨论】：