bs-custom-file-input 不适用于 Angular

Question

我正在尝试在 Angular (7) 应用程序中使用 bs-custom-file-input，但它没有按预期工作。 选择文件时，文件名未按预期显示在标签上。

我设置模块的步骤在哪里：

1. 安装 bs-custom-file-input：

npm install bs-custom-file-input --save

1. 将其导入我的组件：

从'bs-custom-file-input'导入bsCustomFileInput；

1. 初始化插件：

   ngOnInit() { bsCustomFileInput.init(); }

2. HTML：

<div class="custom-file">
  <input id="inputGroupFile01" type="file" class="custom-file-input">
  <label class="custom-file-label" for="inputGroupFile01">Choose file</label>
</div>

我在这里错过了什么？

Answer 1

Bootstrap documentation 声明

我们通过不透明度隐藏默认文件<input>，而是设置<label> 的样式。

这意味着当<input> 字段的值发生变化时，您必须自己更新<label> 的innerHTML。

This article by Alain Boudard 提供了如何使其在 Angular 中工作的代码示例。