Skip to content

ngZone not intialized in MatSidenav (MatDrawer) while using es2015+ #10567

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
universonic opened this issue Mar 26, 2018 · 15 comments
Closed

ngZone not intialized in MatSidenav (MatDrawer) while using es2015+ #10567

universonic opened this issue Mar 26, 2018 · 15 comments
Assignees

Comments

@universonic
Copy link

Bug, feature request, or proposal:

I think this is a BUG.

What is the expected behavior?

Just initialize it, instead of a undefined one.

What is the current behavior?

Template:

<mat-sidenav-container>
    <mat-sidenav>
        ...
    </mat-sidenav>
</mat-sidenav-container>

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es2015",
    "paths": {
        "@api": [
            "@api/"
        ],
        "@core": [
            "@core/"
        ],
        "@view": [
            "@view/"
        ]
    },
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

ERROR:

TypeError: Cannot read property 'runOutsideAngular' of undefined
    at new MatDrawer (sidenav.js:212)
    at new MatSidenav (sidenav.js:852)
    at createClass (core.js:10370)
    at createDirectiveInstance (core.js:10217)
    at createViewNodes (core.js:11674)
    at callViewAction (core.js:12108)
    at execComponentViewsAction (core.js:12017)
    at createViewNodes (core.js:11702)
    at callViewAction (core.js:12108)
    at execComponentViewsAction (core.js:12017)

Compiling with es5 will not encounter this issue.

What are the steps to reproduce?

Just modify the tsconfig.json to change the target to es2015.

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

[universonic@KAMIKAZE reproduce]$ ng version

    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
    
Angular CLI: 1.7.3
Node: 6.11.4
OS: darwin x64
Angular: 5.2.9
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.2.4
@angular/cli: 1.7.3
@angular/flex-layout: 5.0.0-beta.13
@angular/material-moment-adapter: 5.2.4
@angular/material: 5.2.4
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.2
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.6.2
webpack-bundle-analyzer: 2.11.1
webpack: 3.11.0

Is there anything else we should know?

@universonic
Copy link
Author

@mmalerba Any updates?

@mmalerba
Copy link
Contributor

mmalerba commented Apr 2, 2018

es2015 currently works in AOT mode only, see #8284 (comment)

@mmalerba mmalerba closed this as completed Apr 2, 2018
@HalfLegend
Copy link

same issue

@hopsinat
Copy link

ng serve --aot --port xxxx worked for me... FINALLY, if you only i knew earlier that es2015 only works in aot atm :D

@hopsinat
Copy link

Nevermind --aot is not a solution, works for like 4 refreshes then it throws a ton of errors, after rerunning ng serve it works again for a few minutes

@deinok
Copy link

deinok commented Oct 25, 2018

@mmalerba Please, reopen this issue. Using AOT works very bad with ng serve.

@vascofernandes
Copy link

Same issue.

1 similar comment
@o-panikarovskiy
Copy link

Same issue.

@knoefel
Copy link

knoefel commented Nov 26, 2018

same issue

2 similar comments
@moohkooh
Copy link

same issue

@ben-wall
Copy link

same issue

@JoseHerradez
Copy link

Same here

@sinedoOo
Copy link

Same here

`Angular CLI: 7.1.4
Node: 10.14.1
OS: win32 x64
Angular: 7.1.4
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package Version

@angular-devkit/architect 0.11.3
@angular-devkit/build-angular 0.11.3
@angular-devkit/build-optimizer 0.11.3
@angular-devkit/build-webpack 0.11.3
@angular-devkit/core 7.1.3
@angular-devkit/schematics 7.1.4
@angular/cdk 7.2.0
@angular/material 7.2.0
@ngtools/webpack 7.1.3
@schematics/angular 7.1.4
@schematics/update 0.11.4
rxjs 6.3.3
typescript 3.1.6
webpack 4.23.1`

@ghost
Copy link

ghost commented Mar 11, 2019

Got scared to death while struggling on launch deadline. --aot worked. Still not sure what happened to regular ng serve

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests