nitedani / vite-plugin-angular

Vite plugin for Angular, using esbuild and SWC
72 stars 5 forks source link

[QUESTION] Lifecyle methods #4

Closed vamidi closed 1 year ago

vamidi commented 1 year ago

Hi there, thanks for the amazing plugins. It works great for me so far. I do have a question about the lifecycle methods. They are not being called. It there something I am doing wrong?

@Component({
    selector: 'home-component',
    standalone: true,
    imports: [CommonModule, HeaderComponent],
    templateUrl: './home.component.html'
})
export class HomeComponent implements OnInit, AfterViewInit {
    constructor(private elem: ElementRef<HTMLElement>) {
        setTimeout(() => {
            let elements: NodeListOf<HTMLElement> = this.elem.nativeElement.querySelectorAll('.set-bg');
            elements.forEach((el: HTMLElement) => {
                el.style.setProperty('background-image', 'url(' + el.dataset['setbg'] ?? '' + ')');
            });
        }, 500)

    }

    ngOnInit(): void {
        console.log('here');
    }

    ngAfterViewInit() {
        let elements = this.elem.nativeElement.querySelectorAll('.set-bg');
        console.log(elements);

    }
}
vamidi commented 1 year ago

My apologies, I had followed a Vite + Angular tutorial where that person had a bootstrap component with this inside.

bootstrapApplication(AppComponent, {
    providers: [
        {
            provide: NgZone,
            useValue: new NgZone({ shouldCoalesceEventChangeDetection: false })
        },
        ...appRouting
    ]
}).catch(err => console.error(err));

And the ngZone part was responsible for the life cycles not being called.