Thuta Learning
ရှာဖွေရန်
IntermediateWeb Developmentintermediate

@Input() - Parent to Child

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

@Input() decorator သည် parent component မှ child component သို့ data pass လုပ်ရန် အသုံးပြုသည်။

typescript
// child.component.ts
import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-child',
  template: `
    <div class="child">
      <h3>{{ title }}</h3>
      <p>Age: {{ age }}</p>
    </div>
  `
})
export class ChildComponent {
  @Input() title: string = '';
  @Input() age: number = 0;
}

// parent.component.ts
@Component({
  selector: 'app-parent',
  template: `
    <app-child [title]="userName" [age]="userAge"></app-child>
  `
})
export class ParentComponent {
  userName = 'John Doe';
  userAge = 25;
}
You should see
(Child component သည် parent မှ 'John Doe' နှင့် 25 ကို receive လုပ်ပြီး display ပြသမည်)
@Input() - Parent to Child | Thuta Learning