Angular 内化翻译文件上传按钮文本

Question

我正在使用 Angular 和 i18n 将应用程序翻译成不同的语言。

如何翻译输入文件上传按钮选择文件和没有文件选择文本。

<input type="file" ng2FileSelect [uploader] = "uploader">

ng2-file-upload

Answer 1

尝试这样的事情：

您可以使用传统方式创建自定义文件上传，这样您就可以使用 Angular internalization translate。

stackblitz

HTML:

<label class="custom-file-upload">
            <input #fileInput  type="file" (change)="select($event)" />
            <span i18n>Upload File</span>
        </label>

CSS:

input[type="file"] {
    display: none;
}
.custom-file-upload {
    border: none;
    display: inline-block;
    padding: 0;
    cursor: pointer;
    float: left;
    margin-bottom: 20px;
    a {
        color: #0000ee;
    }

    a:hover {
        color: #0000ee;
        text-decoration: underline;
    }
}

TS:

export class AppComponent {

  @ViewChild('fileInput') fileInput: any;
  select(event) {
    console.log(event);
  }
}

Angular 内化翻译文件上传按钮文本

Angular internalization translate file upload button text

angular

localization

internationalization

angular-i18n