Question

我有一个要初始化的数组（foo），然后将其作为@Input传递给子模块。

app.component.ts

export class AppComponent {
  foo = [{
    name: 'NAME', desc: this.translate.get('description')
   }];

 constructor(private translate: TranslateService) {
  translate.setDefaultLang('hu'); //edit (forgot to copy this line here)
  }
}

app.component.html

 <app-home [data]='foo'></app-home>

app.home.ts

 export class AppHome {
   @Input data: any;
 }

app.home.html

<h1>{{data.name}}</h1>
<h1>{{data.desc}}</h1>

我希望翻译中的名称和描述能够显示出来，但是什么也不会显示，甚至没有错误。

编辑：使foo成为单个对象，而不是打印一些值的数组，但是转换仍然不起作用[返回对象Object]而不是描述。

Answer 1

由于@ A.Winnen，我的问题得到了回答。如果有人有相同的问题，您可以在https://stackblitz.com/edit/angular-x99jjs

上找到stackblitz的资源

编辑：刚刚意识到不能在此处更改语言-_-：https://stackblitz.com/edit/angular-wf9nvt?file=src%2Fassets%2Fi18n%2Fro.json

Answer 2

自定义组件

import { TranslateService } from "@ngx-translate/core";
    @Component({
      selector: "app-date-picker",
      templateUrl: "./date-picker.component.html"
    })

    export class DatePickerComponent extends BaseComponentHelpers {
      @Input() placeholderText: string;

      constructor(
        public fb: FormBuilder,
        private translateService: TranslateService
      ) {
        super();
      }
    }

用法

<app-date-picker
              #currentDocumentDate
              [placeholderText]="'invoice.DOCUMENT_DATE' | translate"></app-date-picker>

打字稿无法将翻译作为输入

2 个答案: