EventEmitter when submitting

Question

EventEmitter when submitting

Navigation

#1 by (0 votes)

0

Good morning, I run into the following problem:

When submitting to the child component and sending the object by parameter to the parent component by means of a EventEmiter , the function that receives the event in the parent component is executed twice. One with the object that I really happened to him and another in which he receives the event Submit .

Is this because it happens? Any suggestions?

hijo.ts

export class ProjectFormComponent implements OnInit, OnChanges {
    @Input()
    project: Project;
    @Output()
    submit: EventEmitter<Project> = new EventEmitter();
    formProject: Project;

onSubmit() {
        this.project = this.formProject;
        this.submit.emit(this.project);
    }
}

hijo.html

<form (ngSubmit)="onSubmit()" #projectForm="ngForm" *ngIf="formProject != null">
    <div class="form-group">
        <label for="txtName">Name</label>
        <input [(ngModel)]="formProject.name" type="text" class="form-control" id="txtName" name="Name"/>
    </div>
    <div class="form-group">
        <label for="txtDescription">Description</label>
        <input [(ngModel)]="formProject.description" type="text" class="form-control" id="txtDescription" name="Description"/>
    </div>
    <button type="submit" class="btn btn-success">Submit</button>
    <button type="reset" (click)="clear()" class="btn btn-default">Cancel</button>
</form>

father.htrml

<project-form  [project]="selectedProject" (submit)="onSubmitNotification($event)"></project-form>

angularjs-2.0

asked by locuraskyline 15.03.2017 в 03:12

source

1 answer

Script does not work outside of IDLE Problems viewing data in JTable

score 0 · Answer 1

Remove the child's input.ts and initialize the object:

export class ProjectFormComponent implements OnInit, OnChanges {
    @Output()
    submit: EventEmitter<Project> = new EventEmitter();
    formProject = new Project("nombre" , "descripcion");//inicializa el objeto con valores por defecto
onSubmit() {
    this.project = this.formProject;
    this.submit.emit(this.project);
    }
}

and father.html

<project-form (submit)="onSubmitNotification($event)"></project-form>