微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Angular2实现自定义双向绑定属性

整理文档,搜刮出一个Angular 2实现自定义 双向绑定 属性代码,稍微整理精简一下做下分享

rush:js;"> import { Component,OnInit,Output,Input,EventEmitter } from '@angular/core';

@Component({
selector: 'twoway',template: `
<input [(ngModel)]="username">

Hello {{username}}!

` }) 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是一个约定的固定写法。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐