Dace Zarina angular training #9
Conversation
src/app/app-routes.ts
Outdated
| export const appRoutes: Routes = []; | ||
| export const appRoutes: Routes = [ | ||
| { path: '', redirectTo: '/blog-posts', pathMatch: 'full' }, | ||
| { path: 'blog-posts', component: PostsPageComponent }, |
There was a problem hiding this comment.
As a good practice it is to use lazy loading for routes. In this case it will break bundle into chunks that will be loaded only on a first visit of route. This may significantly improve first loading times especially for bigger applications.
path: 'blog-posts',
// ↓ PostsPageComponentis now lazy loaded
loadComponent: () => import('./path/to/posts-page.component').then(m => m.PostsPageComponent),
|
|
||
| <main> | ||
| <router-outlet></router-outlet> | ||
| <div *ngIf="!route.firstChild"> |
There was a problem hiding this comment.
@if (Control Flow syntax) can be used everywhere. In this case you probably may get rid of CommonModule import in component, but this approach is also correct. just FYI.
| @Component({ | ||
| selector: 'app-guest-form', | ||
| templateUrl: './guest-form.component.html', | ||
| standalone: true, |
There was a problem hiding this comment.
In Angular 19 standalone = true is default so can be not added, but its not a mistake.
| private avatarService: AvatarService | ||
| ) { | ||
| if (this.entry$ != undefined) { | ||
| this.entry$.subscribe(entry => { |
There was a problem hiding this comment.
When you have a subscription you should always unsubscribe from it when component is destroyed. Otherwise it may lead to memory leaks and unwanted effects when this component is opened.
private subscriptions = new Subscription();
public ngOnInit() {
this.subscriptions.add(
this.service.yourObservableReturningFunction().subscribe(...)
)
}
public ngOnDestroy() {
this.subscriptions.unsubscribe();
}
Pull request