13
2020
10

指令分类

组件:用于构建UI组件,继承于Directive类属性指令:用于改变组件的外观或行为ngClassngStyle结构指令:用于动态添加或删除DOM元素来改变DOM布局ngIfngForngSwitch自定义指令
13
2020
10

生命周期钩子

生命周期的顺序,见下图:ngOnChanges:当组件数据绑定的输入属性发生变化是触发,该方法接收一个SimpleChanges对象,包括当前值和上一个属性值。首次调用一定发生在ngOnInit前,值得注意的是该方法仅限于对象的引用发生变化时才会触发。ngOninit:初始化指令或组件,在angular第一次显示展示组件的绑定属性后调用,该方法只会调用一次ngDocheck:检测                &nb
13
2020
10

父子组件之间的数据传递

@Input 父组件向子组件传递数据和传递方法(子组件中使用)@output 子组件传值给父组件  (事件传递的方式)(子组件中使用)//子组件中使用事件发射器@output()  somethingChanged = new EventEmitter();somethingChanged.emit(value);使用@ViewChid 父组件通过局部变量获取子组件的引用,主动获取子组件的数据和方法(父组件中使用)
13
2020
10

双向数据绑定的原理

data => view:数据绑定,模板语法 [ ]view => data:   事件绑定,模板语法()angular的双向数据绑定就是 数据绑定 + 事件绑定 ,模板语法 [()]
13
2020
10

组件和指令的区别

component使用注解@Component修饰,directive使用注解@Directive修饰component是组件化思想,基于组件创建应用,把应用划分成细小的可重复利用的组件,而directive用来在已经存在的DOM元素上实现一些行为component是可重复使用的组件,directive是可重复使用的行为component可创建一个view,即template或templateUrl,而directive没有。
13
2020
10

ng-content指令?

像p标签或者h1标签,在标记之间可以添加内容,eg: <p>this is a paragraph</p>.那我们如果想在angular的标签之间添加内容呢,例如在<app-test></app-test>,这种情况下就可以使用<ng-content>tag directive is used</ng-content>
13
2020
10

router.navigate 的使用?

当我们想路由到一个组件的时候使用router.navigatethis.router.navigate(['./component name']) 
13
2020
10

什么是ViewEncapsulation

ViewEncapsulation 决定组件中定义的样式是否会影响整个应用程序。在Angular中有三种方法可以做到这一点:Emulated : 样式从其他HTML传播到组件。Native : 来自其他HTML的样式不会传播到组件。None:组件中定义的样式对所有组件都是可见的。
13
2020
10

RouterOutlet

<router-outlet></router-outlet>简单理解:页面占位符,决定component显示在哪里,最终会被相应的component的view替换掉
13
2020
10

{{}}

与HTML标签一起使用,eg:<h1>{{var}}</h1>var 是来自于ts(component)中的值。