刚开始开发angular2 项目时，遇到问题有查找一些问题的解决步骤汇总，现在把它分享出来也许能帮助到开发angular2+ 项目的人。
- Can't bind to 'ngClass' since it isn't a known property of 'div'.
解决方案：
import { CommonModule } from '@angular/common';
- ERROR Error: Uncaught (in promise): Error: No provider for Http!
解决：
providers: [Http]
- ERROR Error: Uncaught (in promise): Error: No provider for ConnectionBackend!
解决：以下答案来自overstackflow
Http is redundant in
providers: [FrameService, Http, { provide: $WINDOW, useValue: window }],
because HttpModule in
imports: [HttpModule, BrowserModule, FormsModule],
provides it already.
- ERROR Error: Uncaught (in promise): Error: Template parse errors:Can't bind to 'ngForOf' since it isn't a known property of 'tr'.
解决方式：1
@NgModule({
imports: [CommonModule]
})
or if you don't mind the module being locked to be browser-only
解决方式：2
@NgModule({
imports: [BrowserModule],
})
- implements interface 'OnInit'.Property 'ngOnInit' is missing in type 'BfMenuItem'.
解决：添加 ngOnInit() 生命周期
- Uncaught (in promise): Error: Expected 'styles' to be an array of strings.
解决： 查看styleUrls 样式引入写法是否有问题
错误写法：
styleUrls: ['./bf-header-msg.component']
正确写法:
styleUrls: ['./bf-header-msg.component.scss'],
- Can't bind to 'routerLink' since it isn't a known property of
解决：
import { RouterModule} from '@angular/router';
- Unexpected closing tag "ba-breadcrumb". It may happen when the tag has already been closed by another tag.
解决：标签没有闭合，或闭合标签错误。
- ERROR Error: Uncaught (in promise): Error: Template parse errors:'bf-breadcrumb' is not a known element:If 'bf-breadcrumb' is an Angular component, then verify that it is part of this module.
解决：
错误原因1：declarations: [] 在元数据中声明当前组件
错误原因2：组件元数据中选择器属性和html中标签不匹配
- ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'pages/demo'
解决：路由配置错误，查看路由配置
- Error: Unexpected value 'BfbreakcrumbComponent' declared by the module 'BfHomeModule'. Please add a @Pipe/@Directive/@Component annotation.
解决：添加注解 @Pipe/@Directive/@Component
12: Can't bind to 'ngModel' since it isn't a known property of 'input'.
解决： 引入FormsModule
import { FormsModule} from "@angular/common";
- 菜单跳转路由失败的原因。（提示路径不匹配，match）
解决：
原因1：在menu.config.ts配置文件中配置出错。
原因2：在menu.config.ts配置没有问题。开发的模块代码出错也会提示路径不匹配，以下是遇到的原因。
原因3：服务没有在模块中注入。
- Can't bind to 'label' since it isn't a known property of 'button'.
解决：在button标签中，并没有label属性，label是属于其他组件封装的属性，需要引入相对应的模块。
- Can't bind to 'ngClass' since it isn't a known property of 'div'.
解决：
import { CommonModule } from "@angular/common";
- Unexpected module 'BrowserAnimationsModule' declared by the module 'AppModule'. Please add a @Pipe/@Directive/@Component annotation.
错误原因：declarations: [] ,在这个元数据中引入了模块，导致引入位置错误，
解决：在imports: [] 引入模块。
- ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value
解决： 组件使用中，是否存在异步调用问题，解决异步调用中，处理数据还没有加载的情况。
- Error: No NgModule metadata found for 'undefined'.Error: No NgModule metadata found for 'undefined'.
解决：路由配置错误，检查路由配置路径和模块是否对应
{
path: 'demo/treedemo',
loadChildren: './scene/searchform/demo.module.ts#DemoModule'
}
- The pipe 'json' could not be found
解决：
import { CommonModule } from '@angular/common';
@NgModule({
...
imports: [ CommonModule ]
...
})
- If ngModel is used within a form tag, either the name attribute must be set or the form control must be defined as 'standalone' in ngModelOptions
解决： input 添加name属性
- Template parse errors:There is no directive with "exportAs" set to "ngModel"
解决： 给input绑定[(ngModel)]="inputValue"
- Failed to execute 'setAttribute' on 'Element': '(ngModel)]' is not a valid attribute name.
解决： (ngModel)], 少写一个 [
- There is no directive with "exportAs" set to "ngModel"
解决：
import { FormsModule } from '@angular/forms';2.[(ngModel)]="oldPwdValue"
绑定数据
- ERROR Error: No provider for ChildrenOutletContexts!
解决：routing 模块没有在主模块中引入，routing模块并不能单独存在。