如何以棱角材料形式添加自定义选择文件以上传文档

Question

我正在为我的应用程序进行文件上传/文档上传，希望使用新的棱角材料自定义文件上传的外观，因此希望获得有关如何使用棱角材料来实现此功能的帮助

Angular Material的新手，对此需要指导。

Answer 1

您可以使用label作为输入的父项，并隐藏输入并根据需要自定义标签，例如以下示例：

.upload-btn>input {
  display: none
}

.upload-btn {
  background: #eee;
  padding: 5px 10px;
}

.upload-btn:active {
  background: #ddd
}

<label class="upload-btn">
 Upload or icon here
 <input type="file">
</label>