How to bind a child component into parent based on environment property?

0
votes

I'm trying to bind a child component into a parent based on an if statement form environment file :

parent.component.html:

<form>
   ...
   <app-address *ngIf="userAddress"... #inputUserAddress></app-child>
   ...
   <button (click)="addUserAttribute( inputUserAddress.value )"></button>
</form>

parent.component.ts:

public userAddress = environment.formFields.address;

environment.prod.ts:

formFields{ address: true}

When I run ng serve --prod, it looks like the child component has not been bound into parent. Error:

Property 'value' does not exist on type 'ElementRef'

If I remove the *ngIf and just embed the child directly, then it works straight forward.

Where am I going wrong? Would this kind of concept work?

2
angular

2 Answers

0
votes

You need to fill this property in your environment.prod.ts file.

0
votes

You are accessing an ElementRef type.

https://angular.io/api/core/ElementRef

Change the HTML to this:

<button (click)="addUserAttribute( inputUserAddress.nativeElement.value )"></button>