怎么用TypeScript在按钮上写一个弹窗

首先，在TypeScript中使用弹窗需要引入相应的库，比如使用Bootstrap的弹窗功能。

然后，在按钮的点击事件中添加弹窗的代码，可以使用以下示例代码：

import * as $ from 'jquery'; // 引入jQuery库
import 'bootstrap'; // 引入Bootstrap库

const btn = document.getElementById('myBtn'); // 获取按钮元素

btn.addEventListener('click', () => {
  // 创建弹窗内容
  const modalContent = `
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">弹窗标题</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        弹窗内容
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary">保存</button>
      </div>
    </div>
  `;

  // 创建弹窗
  const modal = $('<div>').addClass('modal fade').attr('tabindex', -1).attr('role', 'dialog').append(modalContent);

  // 显示弹窗
  modal.modal('show');
});

以上代码中，我们首先获取了按钮元素，然后在按钮的点击事件中创建了一个包含弹窗内容的字符串，接着使用jQuery动态创建了一个Bootstrap弹窗，并将弹窗内容添加到其中，最后使用`modal('show')`方法显示弹窗。

需要注意的是，使用Bootstrap的弹窗功能需要在页面中引入相关的CSS和JavaScript文件，否则弹窗可能无法正常显示。