今天完成的事：完成里组件的一部分

明天要完成的事：了解数据接收和发送

难题：无法改变组件库组件的样式试了n次，登录界面获取数据的原理内容以及机制不了解，另外对组件库不了解很多好东西在面前不会用

收获：

:host ::ng-deep

光使用css无法改变组件库组件的样式：必须加上上面那个前缀在css前才能改变

如何修改自己双向绑定里的数据使其呈现出自己想要的样子：

在数据外加上方法判断显示什么，

进一步的话就是

把后台传过来的链接变成图像，

自己写了一个数据请求的方法获取自己需要的数据，并加以储存，

然后就是怎样获取父组件的数据

1使用@input传递数据

1、父组件使用自组件app-header传入msg数据。

<app-header [msg]="msg"></app-header>

2、子组件引入 Input 

import { Component, OnInit ,Input } from '@angular/core';

3、子组件中 @Input msg：string 接收父组件传过来的数据

export class HeaderComponent implements OnInit {

@Input() msg:string

constructor() { }

ngOnInit() {

}

}

4、子组件使用父组件的数据

{{msg}}

2使用@input传递数据

实现子组件调用父组件的方法

1、父组件定义方法

run(){

alert('这是父组件的 run 方法');

}

2、在使用自组件是传递方法 run()

<app-header [msg]="msg" [run]="run"></app-header>

3、子组件接收父组件的方法并使用过

export class HeaderComponent implements OnInit {

@Input() msg:string;

@Input() run:any;

constructor() { }

ngOnInit() {

this.run(); /*子组件调用父组件的 run 方法*/

}

}