Angular2:在EventEmitter中传递单个参数
发布时间:2020-12-17 17:21:40 所属栏目:安全 来源:网络整理
导读:我有2个组件,一个’创建’组件和一个子’形式’组件.我需要表单组件来传递submit事件以及表单数据. 真正的问题是当我记录收到的事件时,我得到2,而不是一个事件/ arg.这是它记录的内容:Event {isTrusted:true}然后是Contact {name:inputName} 如何过滤事件
我有2个组件,一个’创建’组件和一个子’形式’组件.我需要表单组件来传递submit事件以及表单数据.
真正的问题是当我记录收到的事件时,我得到2,而不是一个事件/ arg.这是它记录的内容:Event {isTrusted:true}然后是Contact {name:inputName} 如何过滤事件,以便仅在收到Contact对象时才执行操作? 父’创建’组件: import {Component,OnInit } from 'angular2/core'; import {Contact} from './contact'; import {ContactFormComponent} from './contact-form.component'; @Component({ selector: 'contact-create',template: ` <h2>Nuevo contacto</h2> <div class="panel panel-default"> <div class="panel-body"> <contact-form [contact]="contact" (formSubmitted)="saveContact($event)"></contact-form> </div> </div> `,directives: [ContactFormComponent] }) export class ContactCreateComponent { contact: Contact = new Contact(''); constructor( private router: Router,private contactService: ContactService) { } saveContact(args) { console.log(args); } } 儿童’形式’组件 import {Component,EventEmitter} from 'angular2/core'; import {NgForm} from 'angular2/common'; import {Contact} from './contact'; @Component({ selector: 'contact-form',inputs: ['contact'],outputs: ['formSubmitted'],templateUrl: 'app/contacts/contact-form.component.html',}) export class ContactFormComponent { contact: Contact; formSubmitted: EventEmitter<any> = new EventEmitter(); onSubmit(contact) { this.formSubmitted.next(contact); } } 解决方法
供参考和添加更多信息请注意,在输出名称最初提交的问题与
DOM submit event匹配(由于我在
first comment中没有解释问题而在问题中将其重命名)所以最初的问题是该组件正在捕获两个事件:OP定义的输出和表单中的事件.
有一个问题(见#4059)跟踪此行为.这显然不应该发生. 对@Sasxa充分尊重的真正解决方案是将输出重命名为与DOM提交事件不匹配,直到实现上述问题为止. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
推荐文章
站长推荐
- Docker下mysql设置字符集的方法
- 如何将现有项目转换为angular-cli?
- WebService for Android
- angularjs – $apply vs $digest在指令测试
- vim – “set-window-option -g mode-keys vi”在
- bash – 当我们将命令放在美元符号和括号内时,这
- ServiceMix做内部服务器发布WebService(附带案例
- promise – 如何从angular2-modal返回结果,或者通
- angularjs – $locationChangeStart,$routeChang
- angularjs – ng-map:设置缩放级别时无法读取un
热点阅读