简体   繁体   中英

Angular2 OnInit Not Firing IE11

It seems like IE11 isn't firing OnInit when you navigate to another angular2 route, then come back to the original route. So to be clear route1 is the route in question and is the default route. When route1 loads OnInit is fired in my component1 just fine, I navigate to route2/component2 OnInit fires fine as well. The issue is when I navigate back to route1/component1 OnInit doesn't fire in IE, but it does in all other browsers. We're on RC3.

Here is my component in question:

import { Component, OnInit} from '@angular/core';
import { UdrService} from './udr.service';
import { Widget} from '../widget';

@Component({
    selector: 'udr',
    templateUrl: './Home/RenderUDR',
    providers: [UdrService]
})

export class UdrComponent implements OnInit {
    constructor(private _udrService: UdrService) { }

    widgets: Widget[];

    ngOnInit() {
        this._udrService.getUdrActiveWidgets()
            .subscribe(wdgts => this.widgets = wdgts);
    }
}

Thanks!

EDIT 1 --- I have noticed that when other events happen in the DOM (ie onhover is fired on an element, or i open a drop down, the OnInit method fires, it seems like when angular2 change detection fires it finally fires OnInit)

EDIT 2 --- The issue is still present in rc4. It seems like my issue is this:

https://github.com/angular/angular/issues/10146

The linked to fix shows an update to router.ts. I dont see that file bundled in the npm package, only the transpiled router.js file. How do i apply this update?

Thanks

It seems like there are several reports of this issue that are duplicates on the Angular2 github site. I lifted a work around from this link: GitHub Issue

The only modification I had to make was _router.events.subscribe instead of _router.subscribe because I think _router.events.subscribe is new to the component router.

export class AppComponent {

constructor(private _applicationRef: ApplicationRef, private _router: Router) {

    _router.events.subscribe(() => {
        this._applicationRef.tick();
        setTimeout(() => {
            this._applicationRef.tick();
        }, 100);
    });

}

I hope this is resolved in RC5, but this seems to work for now.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM