Question

我对Angular还是很陌生。我在doc和stackoverflow中寻找答案，但没有找到。所以，对不起，如果我的问题很讨厌。

我创建了一个组件来将模式内容保存在单独的文件中。我从父组件使用open.dialog这样打开此模式：

  openMyModalDialog() {
    const dialogRef = this.dialog.open(MyModalComponent, {
      panelClass: 'own-modal',
      width: '300px'
    });

    dialogRef.afterClosed().subscribe(result => {
      alert('closed');
    });
  }

好吧，MyModalComponent：

<h1 mat-dialog-title>{{ 'myTargetTranslateKey' | translate }}</h1>
<div mat-dialog-content>
  <p>What's your favorite animal?</p>
  <mat-form-field>
    <mat-label>Favorite Animal</mat-label>
  </mat-form-field>
</div>
<div mat-dialog-actions>
  <button mat-button (click)="onNoClick()">No Thanks</button>
</div>

我没有在模态组件中导入TranslateModule，因为我认为这是在模块中导入的。

...

@NgModule({
  imports: [
    CommonModule,
    TranslateModule,
    MomentModule,
    IMaskModule,

它也已导入app.module.ts中。使用TranslateModule.forRoot（）。

重要的是说|翻译管道可以在其他任何组件/代码中使用，也可以在打开对话框的父级中使用。

谢谢！

更新：我已经从modal组件中的ngx-translate / core导入了TranslateService。我将console.log放在关闭事件上，我可以看到this.translateSevice.instant（'key'）可以正常工作！...所以问题是管道不起作用。

更新2 ：它也可以与<h1 mat-dialog-title [translate]="'key'"></h1>一起使用，但不适用于管道！：'（

更新3 ：管道不起作用，表示结果为空，不显示任何内容，但控制台中也没有错误。

Answer 1

我发现了错误。抱歉，这个新手错误。

我从角材料文档中复制的示例具有一个内部组件（mat-form -...），该内部组件未导入，因此我不使用。

没有错误消息，什么都没有。我将其删除，一切正常。

谢谢。

在角材料对话框中平移管道不起作用

1 个答案: