angular может получить доступ к Zone из разведки vscode, но при запуске в chrome вернуть неопределенное значение
Когда я пытаюсь использовать Zone в ngOnInit в своем угловом приложении, я устанавливаю точку останова в строке 11 и получаю функцию Zone(parent,zoneSpec){....}, но при запуске в chrome возвращаю undefined? это мой код:( https://stackblitz.com/edit/angular-c98byw)
export class AppComponent implements OnInit{
ngOnInit(): void {
// RootZone is ambient and it is
indistinguishable from no Zone.
console.dir(Zone)
let rootZone = Zone.current;
// We create a new zone by forking an
existing zone.
let zoneA = rootZone.fork({name: 'zoneA'});
// Each zone has a name for debugging
console.log(rootZone.name);
// (rootZone.name).toEqual('<root>');
// expect(zoneA.name).toEqual('zoneA');
// // Child zone knows about its parent zone.
(one way reference)
// expect(zoneA.parent).toBe(rootZone);
}
title = 'app';
@ViewChild('vc', {read: ViewContainerRef}) vc: ViewContainerRef;
constructor(private zone:NgZone,
private _compiler: Compiler,
private _injector: Injector,
private _m: NgModuleRef<any>) {
}
При отладке в vscode: я могу получить доступ от intellgence vscode. Но ошибка была выкинута из хрома:
AppComponent_Host.ngfactory.js? [sm]:1 ERROR TypeError: Cannot read property 'current' of undefined
at AppComponent.push../src/app/app.component.ts.AppComponent.ngOnInit (app.component.ts:12)
at checkAndUpdateDirectiveInline (core.js:9035)
at checkAndUpdateNodeInline (core.js:10299)
at checkAndUpdateNode (core.js:10261)
at debugCheckAndUpdateNode (core.js:10894)
at debugCheckDirectivesFn (core.js:10854)
at Object.eval [as updateDirectives] (AppComponent_Host.ngfactory.js? [sm]:1)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:10846)
at checkAndUpdateView (core.js:10243)
at callWithDebugContext (core.js:11136)
View_AppComponent_Host_0 @ AppComponent_Host.ngfactory.js? [sm]:1
proxyClass @ compiler.js:10048
push../node_modules/@angular/core/fesm5/core.js.DebugContext_.logError @ core.js:11098
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:1679
(anonymous) @ core.js:4524
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:3719
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.tick @ core.js:4524
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef._loadComponent @ core.js:4551
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.bootstrap @ core.js:4493
(anonymous) @ core.js:4294
push../node_modules/@angular/core/fesm5/core.js.PlatformRef._moduleDoBootstrap @ core.js:4294
(anonymous) @ core.js:4260
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
onInvoke @ core.js:3760
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
onInvokeTask @ core.js:3751
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
Promise.then (async)
scheduleMicroTask @ zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:252
scheduleResolveOrReject @ zone.js:862
ZoneAwarePromise.then @ zone.js:962
push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule @ core.js:4289
./src/main.ts @ main.ts:11
__webpack_require__ @ bootstrap:76
0 @ main.ts:12
__webpack_require__ @ bootstrap:76
checkDeferredModules @ bootstrap:43
webpackJsonpCallback @ bootstrap:30
(anonymous) @ main.js:1
AppComponent_Host.ngfactory.js? [sm]:1 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 0, nodeDef: {…}, elDef: {…}, elView: {…}}
View_AppComponent_Host_0 @ AppComponent_Host.ngfactory.js? [sm]:1
proxyClass @ compiler.js:10048
push../node_modules/@angular/core/fesm5/core.js.DebugContext_.logError @ core.js:11098
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:1684
(anonymous) @ core.js:4524
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:3719
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.tick @ core.js:4524
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef._loadComponent @ core.js:4551
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.bootstrap @ core.js:4493
(anonymous) @ core.js:4294
push../node_modules/@angular/core/fesm5/core.js.PlatformRef._moduleDoBootstrap @ core.js:4294
(anonymous) @ core.js:4260
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
onInvoke @ core.js:3760
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
onInvokeTask @ core.js:3751
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
Promise.then (async)
scheduleMicroTask @ zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:252
scheduleResolveOrReject @ zone.js:862
ZoneAwarePromise.then @ zone.js:962
push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule @ core.js:4289
./src/main.ts @ main.ts:11
__webpack_require__ @ bootstrap:76
0 @ main.ts:12
__webpack_require__ @ bootstrap:76
checkDeferredModules @ bootstrap:43
webpackJsonpCallback @ bootstrap:30
(anonymous) @ main.js:1
core.js:3077 Angular is running in the development mode. Call enableProdMode() to enable the production mode.
1 ответ
Решение
Вам нужно будет указать, что это на объекте окна.
Если вы используете console.dir(window["Zone"]) вместо этого вы увидите, что функция зарегистрирована в консоли, как и ожидалось
Вы также можете добавить let Zone = window["Zone"] до первой строки ngOnInit