Angular2实现自定义双向绑定属性
时间:2021-06-09 08:05:32|栏目:AngularJS|点击: 次
整理文档,搜刮出一个Angular 2实现自定义 双向绑定 属性的代码,稍微整理精简一下做下分享。
import { Component, OnInit, Output, Input, EventEmitter } from '@angular/core'; @Component({ selector: 'twoway', template: ` <input [(ngModel)]="username"> <p>Hello {{username}}!</p> ` }) export class TwoWayComponent implements OnInit { constructor() { } usernameValue: string; @Output() usernameChange = new EventEmitter(); @Input() get username() { return this.usernameValue; } set username(val) { this.usernameValue = val; this.usernameChange.emit(this.usernameValue); } ngOnInit() { } }
使用时,就可以通过[(username)]=“你的当前属性” 进行双向绑定了。属性名 + 后缀 Change是一个约定的固定写法。
栏 目:AngularJS
下一篇:AngularJS学习笔记之基本指令(init、repeat)
本文标题:Angular2实现自定义双向绑定属性
本文地址:http://www.codeinn.net/misctech/138150.html