Angular ရှိ Template Variables များ

Angular တွင် template variables များကို အသုံးပြု၍ page ၏ tags များကို ရယူနိုင်ပါသည်။ ၄င်းတို့သည် tag တစ်ခုကို variable တစ်ခုနှင့် ချိတ်ဆက်ပေးပြီး component အလုပ်လုပ်နေစဉ် ကိုးကားရန် ခွင့်ပြုပါသည်။ ထိုကဲ့သို့ variable တစ်ခု ကြေညာရန် ၎င်း၏အမည်ရှေ့တွင် # သင်္ကေတကို ထည့်ရပါမည်။

လက်တွေ့လေ့လာကြည့်ရအောင်။ ဥပမာအားဖြင့် ကျွန်ုပ်တို့တွင် div တစ်ခုရှိသည်ဆိုပါစို့။ ၎င်းကို template variable အတွင်း ရေးကြည့်ပါမည်။

app/app.component.html<div #userName>
  text
</div>

ယခု userName variable အတွင်း ကျွန်ုပ်တို့၏ div ၏ DOM element သို့ reference တစ်ခု ရှိပါလိမ့်မည်။ ထို့အပြင် ကျွန်ုပ်တို့သည် ၎င်းကို JavaScript စစ်စစ် တွင် ပြုလုပ်သည့်အတိုင်း ကိုင်တွယ်နိုင်ပါသည်။ ဥပမာအားဖြင့် ထို div ၏ text ကို အခြား tag အတွင်း ထုတ်ပြကြည့်ပါမည်။

app/app.component.html<div>
  {{ userName.textContent }}
</div>
Задание 1

Div တစ်ခုပေးထားသည်။ ရုပ်ပုံတစ်ပုံပေးထားသည်။ ရုပ်ပုံသို့ reference ကို template variable အတွင်း ရေးပါ။ ကျွန်ုပ်တို့၏ ရုပ်ပုံ၏ src ကို div အတွင်း ထုတ်ပြပါ။