[Fixed] How can i send property value as object value?

Issue

I am having component where i am sending data for my input property there.

I am sending object in my data input property in FormGroup component.

<app-form-group shouldTheInputBeDisabled='false' formControlName="salary" [data]="{ field: 'salary', label: 'Specify the salary for' + ' ' +  'John' }"></app-form-group>

i want to make my label dynamically. Here John is hardcoded – but i should get the value from userName property from my component – the typescript file.

Is there some way that i gen generate this through HTML? I tried

[data]="{ field: 'salary', label: 'Specify the salary for' + ' ' +  `${userName}` }"

but without success.

I know that i can prepare all of this in my ts file and after that just send that
prepaired in the child component, but i wonder can this be done in the html directly ?

Solution

You cannot use template literals inside Angular templates.
Using your example, you’d have to concatenate the string directly:

[data]="{ field: 'salary', label: 'Specify the salary for ' + userName }"