Failed to create Navigation Schematic
See original GitHub issueBug:
Failed to create Navigation Schematic using Angular CLI and causing error while running Angular application using ng serve.
What is the expected behavior?
The navigation schematic should be displayed while running or building angular application using ng serve or ng build
What is the current behavior?
Thowing exception on ng serve.
ERROR in src/app/navigation/navigation.component.ts(13,3): error TS2322: Type ‘Observable<boolean>’ is not assignable to type ‘Observable<BreakpointState>’. Type ‘boolean’ is not assignable to type ‘BreakpointState’
What are the steps to reproduce?
ng new Blog
cd Blog
ng add @angular/material
ng generate @angular/material:material-nav --name navigation
remove all html code from app.component.html and add <navigation></navigation>
.
What is the use-case or motivation for changing an existing behavior?
Create Angular Material Navigation using Angular CLI.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
{
"name": "blog",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^6.0.3",
"@angular/common": "^6.0.3",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",
"@angular/forms": "^6.0.3",
"@angular/http": "^6.0.3",
"@angular/material": "^6.1.0",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/router": "^6.0.3",
"core-js": "^2.5.4",
"rxjs": "^6.0.0",
"zone.js": "^0.8.26",
"@angular/cdk": "^6.1.0"
},
"devDependencies": {
"@angular/compiler-cli": "^6.0.3",
"@angular-devkit/build-angular": "~0.6.5",
"typescript": "~2.7.2",
"@angular/cli": "~6.0.5",
"@angular/language-service": "^6.0.3",
"@types/jasmine": "~2.8.6",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~1.4.2",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.3.0",
"ts-node": "~5.0.1",
"tslint": "~5.9.1"
}
}
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (3 by maintainers)
Top Results From Across the Web
Angular material : Navigation schematics doesn't work
I want to create angular material navigation schematics. when i run ng generate @angular/material:navigation command it gives error.
Read more >Troubleshooting - Unity - Manual
The Package Manager window might get moved offscreen or hidden by another window. When this happens, it looks like the Package Manager window...
Read more >Schematics - Angular Material
The navigation schematic will create a new component that includes a toolbar with the app name, and a responsive side nav based on...
Read more >Create an Angular App with a Side-Navigation and ... - Medium
Angular is a powerful tool for building large web applications. To get started with Angular we can use Schematics. It allows us to...
Read more >Angular CLI App Gives Error The Schematic Workflow Failed
When you are going to create a new angular app. It gives an error "The Schematic Workflow Failed for package installation failed ", ......
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Duplicate of #11441 and #11445… also it’s already fixed by #11448.
Yep, just found the same (fresh install of a new project with the latest Angular CLI)
In the component, it should be like this:
Moreover, in the according template, the
async
needs to be wrapped with( ... )
likeAfter that, the app should be running. However, there’s another issue. The overlay doesn’t expand over the entire page, but rather just keeps being over the toolbar and content you added:
This leads to the strange behavior that the side-nav obviously just closes when you click exactly on that toolbar where the overlay is. I’d change this behaviour to stretch to the entire page