去掉每个文件angular 6的文件扩展名

Question

HTML 是在我获取文件名的地方编写的，但我想摆脱文件扩展名，并将文件存储在数组中并在 UI 中访问它们。

<div class="myReadingListContainer">
        <div class="readingList">
                My Reading List
        </div>
        <div class="myReadingList">
                <div class="uploadWrap">
                        <input type="file" #file (change)="onChange(file.files)" class="fileUploadInput" />
                        <div class="innerText">
                                <img src="assets/img/my_reading_list/Add.svg" class="addIcon">
                                <h6 class="addFile">Add Files</h6>
                        </div>
                </div>
                <div *ngFor="let file of fileList">
                        <div class="selectedFile">
                                <div class="documentName">
                                        {{file.name}}
                                </div>
                                <span *ngIf="file.type === 'application/pdf'">
                                        <img src="assets/img/my_reading_list/PDF.svg" class="fileTypeImage">
                                </span>
                                <span *ngIf="file.type === 'application/vnd.ms-excel'">
                                        <img src="assets/img/my_reading_list/Excel.svg" class="fileTypeImage">
                                </span>
                                <div class="readingStatus">
                                        20/35 Pages
                                </div>
                                <div class="progress">
                                        <div class="progressBar"></div>
                                </div>
                        </div>
                </div>
        </div>
</div>

打字稿文件是这样写的。由于我是 Angular 6 的新手，非常感谢任何帮助，提前致谢

import { Component, OnInit } from "@angular/core";

    @Component({
      selector: "app-myReadingList",
      templateUrl: "./myReadingList.component.html",
      styleUrls: \["./myReadingList.component.scss"\]
    })
    export class MyReadingListComponent implements OnInit {
      //localUrl: String;
      fileList: any = \[\];
      files: any;
      constructor() {}
      onChange(files: FileList) {
        console.log(files);
        this.files = files;
        this.fileList.push(files\[0\]);
        this.fileList.forEach(file => {
          let temp = file.name.split(".");
          file.name = temp.splice(0, temp.length - 1).join(".");
        });
        console.log(this.fileList);
      }
      ngOnInit() {}
    }

Answer 1

这是在显示时删除文件扩展名的示例代码 fileList.name

<div class="documentName">
    {{file.name.split('.').slice(0, -1).join('.')}}
</div>

演示相同