如何单击Bootstrap4输入组中的HTML输入来触发绑定事件

我有一个Bootstrap 4输入组，其中包含一个前置标题和一个输入，如图所示：

    <div class="input-group" (click)="openDoc()">
      <div class="input-group-prepend input-group-prepend-split rounded-0">
          <label class="input-group-text rounded-0 bg-white">Name</label>
      </div>
      <input type="text" class="form-control rounded-0" value="{{_transaction.originalDoc?.name}}" disabled>
      <input type="text" class="form-control rounded-0 link" value="{{_transaction.doc?.name}}" disabled>
   </div>

名称

我想让事件

（单击）=“openDoc（）”

存在于第二个输入上，其

值为：{{{u transaction.doc？.name}}

，但除非它在包装器输入组上，否则无法激发事件。我假设元素正在阻塞输入，但我无法找到一种方法来绕过它

---

是否有CSS方法或引导解决方法允许我这样做？

已解决。问题是我的每个输入上的disabled属性，与引导或包装器div无关

删除禁用的属性将允许触发事件

更新：对于遇到此特定问题的任何人，只需将输入上的“disabled”属性替换为“readonly”即可解决此问题。输入中的链接将变为可单击，但输入不可编辑。

您能用代码创建一个链接来帮助您吗？