在使用Antd的时候，一直很好奇里面的双向绑定的自定义组件是怎么做的。
因为之前一直用，没有去细看文档。
今天抽空来简单的撸一下。
在ng中，()是单向数据流，从视图目标到数据源，[()]这样就是双向绑定了。简单的说就是ng给的一个语法糖，帮我们做了子组件内部事件发射的事件监听，然后赋值。
子组件：html
<input placeholder="test" type="text" [(ngModel)]="qc" #qq (ngModelChange)="testevent()">
子组件:ts
@Component({ selector: 'app-qingcheng', templateUrl: './qingcheng.component.html', styleUrls: ['./qingcheng.component.less'] }) export class QingchengComponent implements OnInit { @Input() username: string; @Output() usernameChange = new EventEmitter(); constructor() { } ngOnInit() { } testevent() { console.log(this.username); this.usernameChange.emit(this.username); } }
向外部发射事件的时候，一定要xxxChange，以Change结尾的事件才正确，不然无法双向绑定。。
这个坑找了半天才解决：https://segmentfault.com/a/1190000016651999
父组件：html
<app-qingcheng #qingcheng [(qc)]="testbind"></app-qingcheng> {{testbind}}
父组件：ts
@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.less'] }) export class AppComponent { title = 'qctest'; testbind = ''; }
