Angular trouble passing properties to overlay component

I’m having trouble passing some route parameter properties to an overlay component. The properties I’m trying to pass are genreId, monetization, sortBy, and page. The parent component is looks like this.
export class MoviesPageComponent implements OnI…


This content originally appeared on DEV Community and was authored by Paul Drake

I'm having trouble passing some route parameter properties to an overlay component. The properties I'm trying to pass are genreId, monetization, sortBy, and page. The parent component is looks like this.
export class MoviesPageComponent implements OnInit, OnDestroy {
movies?: MovieData;
private movieSubscription: Subscription = new Subscription;
genreId = '';
monetization = '';
sortBy = '';
page = '';
constructor(private getMovies: GetMoviesService,
private route: ActivatedRoute,
private overlay: Overlay) { }
ngOnInit(): void {
this.route.paramMap.subscribe((params: ParamMap) => {
this.genreId = params.get('genreId') ?? 'default';
this.monetization = params.get('monetization') ?? 'flatrate';
this.sortBy = params.get('sortBy') ?? 'popularity.desc';
this.page = params.get('page') ?? '1';
});
this.movieSubscription = this.getMovies.moviesData(this.genreId, this.monetization, this.sortBy, this.page)
.subscribe(res => this.movies = {...res});
}
openMenu() {
const overlayRef = this.overlay.create();
const overlayComponent = new ComponentPortal(OffcanvasComponent);
overlayRef.attach(overlayComponent);
}
ngOnDestroy(): void {
this.movieSubscription.unsubscribe();
}
}

The overlay component is being passed to the ComponentPortal constructor and stored inside the const overlayComponent, and I need help passing the parameters to the overlay. Thanks!


This content originally appeared on DEV Community and was authored by Paul Drake


Print Share Comment Cite Upload Translate Updates
APA

Paul Drake | Sciencx (2022-04-03T22:02:09+00:00) Angular trouble passing properties to overlay component. Retrieved from https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/

MLA
" » Angular trouble passing properties to overlay component." Paul Drake | Sciencx - Sunday April 3, 2022, https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/
HARVARD
Paul Drake | Sciencx Sunday April 3, 2022 » Angular trouble passing properties to overlay component., viewed ,<https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/>
VANCOUVER
Paul Drake | Sciencx - » Angular trouble passing properties to overlay component. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/
CHICAGO
" » Angular trouble passing properties to overlay component." Paul Drake | Sciencx - Accessed . https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/
IEEE
" » Angular trouble passing properties to overlay component." Paul Drake | Sciencx [Online]. Available: https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/. [Accessed: ]
rf:citation
» Angular trouble passing properties to overlay component | Paul Drake | Sciencx | https://www.scien.cx/2022/04/03/angular-trouble-passing-properties-to-overlay-component/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.