Issue
Here is my ts component
export interface Product{
id?:string,
name:string,
price:string;
quantity:string;
tags:Tags[];
description:string;
files: File[];
}
product$:Observable<Product | undefined>;
ngOnInit(): void {
this.store.dispatch(new productActions.LoadProduct(fromProduct.getCurrentProductId.toString()));
this.product$ = this.store.pipe(select(fromProduct.getCurrentProduct));
}
Last and the second statements gather the value of product observable and work fine.
this.product = this.fb.group({
name:['',[
Validators.required,
Validators.minLength(1),
Validators.maxLength(128)
]],
price:['',
Validators.required],
tags:this.fb.array(this.tags),
quantity:['',Validators.required],
description:['',
Validators.required]
});
}
Now what I want is to set the default value of Form from Product$ (observable)
The above code sets the default value of name ''. But I want to set a default value from (product$ | async).name----->> this works fine in Html, but I have no idea how to do it in typescript.
Thanks for helping me.
Solution
You could put your whole FormGroup initialization into a subscribe. Don't forget to use the first operator though, since you only want to do this once and then unsubscribe.
this.product$
.pipe(first())
.subscribe(product => {
this.product = this.fb.group({
name:[product.name,[
Validators.required,
Validators.minLength(1),
Validators.maxLength(128)
]],
price:['',
Validators.required],
tags:this.fb.array(this.tags),
quantity:['',Validators.required],
description:['',
Validators.required]
});
}
});
Answered By - maiksch
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.