How to dynamic translate text file using parameter to the ngx-translate in angular?

Question

I want to use the dynamic text translate in angular and ngx-translate .

This is my component:

export class ShareErrorComponent implements OnInit ,AfterViewInit {

@Input("form") from: FormGroup
@Input("field") fieldName: string;
@Input("nicename") nicename: string;
param: any;
constructor() { }

ngAfterViewInit(): void {
}

ngOnInit() {
    this.param = { value:this.nicename }
}

fieldErrors(field: string) {
    let controlState = this.from.controls[field];
    return (controlState.dirty || controlState.touched) ? controlState.errors : null;
  }
}

and this is my html code:

  <mat-error *ngIf="fieldErrors(fieldName).required">
   {{ "SHARED_VALIDATE.REQIERD" | translate: param }}
 </mat-error>

and this is my translate file:

       SHARED_VALIDATE: {
        REQIERD: ' Reqied Fill the {{value}}  '
    },

but when i need to translate dynamic it show me this: Reqied Fill the {{value}}

How can I dynamic translate in my text file?

Answer 1

 {{ "SHARED_VALIDATE.REQIERD" | translate: {value: nicename} }}

Spacing is important for object bracket and interpolation bracket