Ufunganishaji wa Matukio Mawili upande katika Angular

Pia katika Angular inawezekana kufanya ufunganishaji wa matukio mawili upande kwa vipengele vyote viwili: mzazi na mtoto. Hebu tufanye katika muundo wa HTML wa mtoto kiingilio na ufunganishaji wa mwelekeo mbili jina la mtumiaji na kazi, inayobadilisha jina:

<input [ngModel]="userName" (ngModelChange)="onNameChange($event)" />

Tuende kwenye kipengele chetu cha mtoto na tulete ndani yake kitengo cha @Input. Kinahitajika kwa kufanya kazi na viingilio:

import { Component, Input, Output, EventEmitter } from '@angular/core';

Ifuatayo, unganisha kitengo @Input kwa jina la mtumiaji. Na kitengo @Output kiunganishe kwa kitu userNameChange, ambacho kitaitwa katika kazi onNameChange:

export class UserComponent {
	@Input() userName: string = '';
	@Output() userNameChange = new EventEmitter<string>();
	onNameChange(model: string) {
		this.userName = model;
		this.userNameChange.emit(model);
	}
}

Sasa tuende kwenye kipengele kikuu na tuongeze kwa darasa lake sifa ya jina:

export class AppComponent {
	name: string = 'alex';
}

Na katika muundo wa HTML wa kipengele cha mzazi fanya ufunganishaji wa mwelekeo mbili wa sifa userName na thamani ya sifa name ya kipengele cha mzazi:

<user-data [(userName)]="name"></user-data>
<p>Umechagua jina: {{ name }}</p>

Tekeleza ufunganishaji wa matukio mawili upande kwa vipengele vya mzazi na mtoto kulingana na mfano ulioletwa katika somo.

Kulingana na shida iliyopita, fanya ufunganishaji wa mwelekeo mbili wa umri wa mtumiaji.