What is Angularjs?


Angularjs แ€€ို แ‚แ€แ€แ‰ แ€ုแ€”္ႏွแ€…္ แ€€ Misko Hevery and Adam Abrons แ€ိုแ‚”แ€€ Brat Tech LLC  แ€™ွာ แ€…แ€แ€„္ေแ€›းแ€žားแ€ဲแ‚”แ€•ါแ€แ€š္။ ေแ€”ာแ€€္แ€•ိုแ€„္းแ€™ွာ google แ€€ แ€แ€›ားแ€แ€„္ ေแ€‘ာแ€€္แ€•แ‚”ံေแ€•းแ€ဲแ‚”แ€•ါแ€แ€š္။ แ€แ€€แ€š္ေแ€ာแ‚” Misko Hevery แ€Ÿာ google แ€›ဲแ‚• แ€แ€”္แ€‘แ€™္းแ€แ€…္ေแ€šာแ€€္ျแ€–แ€…္แ€•ါแ€แ€š္။
แ‚แ€แแ‚ แ€ုႏွแ€…္แ€™ွာ Angularjs แ€›ဲแ‚• version 1 แ€€ို แ€‘ုแ€္ေแ€แ€ဲแ‚”แ€•ါแ€แ€š္။
Angularjs แ€Ÿာ open source javascript framework แ€แ€…္แ€ုျแ€–แ€…္ျแ€•ီး single page application แ€™်ားแ€กแ€ြแ€€္ แ€กแ€‘ူးแ€žแ€„့္ေแ€œ်ာ္แ€•ါแ€แ€š္။
Aungularjs แ€กแ€žံုးျแ€•ဳแ€•ံုแ€Ÿာ jquery แ€‘แ€€္แ€…ာแ€›แ€„္ แ€•ိုแ€™ိုแ€œြแ€š္แ€€ူแ€›ွแ€„္းแ€œแ€„္းแ€•ါแ€แ€š္။
coding ေแ€›းေแ€”แ€›แ€แ€š္แ€†ုိแ€ာแ€‘แ€€္ Html ေแ€›းแ€›แ€ာแ€”ဲแ‚” แ€•ိုแ€™ိုแ€†แ€„္แ€ူแ€•ါแ€แ€š္။ Angular แ€Ÿာ HTML tag attribute แ€กแ€žแ€…္แ€™်ား (directive แ€œိုแ‚” angular แ€™ွာေแ€แšแ€•ါแ€แ€š္) แ€™်ားแ€€ို แ€žံုးျแ€•ီး แ€กแ€œုแ€•္แ€œုแ€•္แ€žြားแ€•ါแ€แ€š္။

angularjs แ€Ÿာ two ways binding แ€กแ€žံုးျแ€•ဳแ€‘ားျแ€•ီး DOM element ေแ€ြแ€”ဲแ‚” javascript  variable ေแ€ြแพแ€€ားแ€™ွာ bind แ€œုแ€•္แ€‘ားေแ€•းแ€•ါแ€แ€š္။
angularjs แ€Ÿာ แ€žာแ€™แ€”္แ€กားျแ€–แ€„့္ แ€แ€€္แ€แ€š္แ€œိုแ‚”แ€‘แ€„္แ€›ေแ€•แ€™แ€š့္ แ€แ€€แ€š္ေแ€œแ‚”แ€œာแ€™แ€š္แ€†ုိแ€›แ€„္ ေแ€›းแ€›แ€žแ€€္แ€žာျแ€•ီး แ€œြแ€š္แ€€ူแ€ာแ€€ိုေแ€ြแ‚”แ€›แ€•ါแ€™แ€š္။

<body>

<div ng-app="">
  <p>Name : <input type="text" ng-model="name"></p>
  <h1>Hello {{name}}</h1>
</div>

</body>

แ€กေแ€•แšแ€€ ေแ€›းแ€‘ားแ€ာแ€€ို แพแ€€แ€Š့္แ€™แ€š္แ€†ိုแ€›แ€„္ ng-model directive แ€กေแ€”แ€”ဲแ‚” name แ€†ိုแ€ဲแ‚” แ€”ာแ€™แ€Š္แ€”ဲแ‚” input form element แ€€ို bind ေแ€•းแ€™ွာျแ€–แ€…္แ€•ါแ€แ€š္။
แ€’ါေแพแ€€ာแ€„့္ application scope แ€‘ဲแ€™ွာ name แ€†ိုแ€ဲแ‚” variable แ€แ€…္แ€ု ျแ€–แ€…္แ€œာแ€™ွာျแ€–แ€…္ျแ€•ီး แ€กဲแ€’ီ input form element แ€™ွာ แ€…ာေแ€›းแ€œိုแ€€္แ€ုိแ€„္း แ€กဲแ€’ီ แ€…ာแ€Ÿာ name variable แ€‘ဲแ€€ို ေแ€›ာแ€€္แ€žြားแ€™ွာแ€•ါ။
แ€’ါေแพแ€€ာแ€„့္ ေแ€กာแ€€္แ€แ€…္ေแพแ€€ာแ€„္းแ€™ွာ {{name}} แ€€ို ျแ€•แ€”္ output แ€‘ုแ€္แ€‘ားแ€ာေแ€ြแ‚”แ€›แ€•ါแ€™แ€š္။ แ€กဲแ€’ီแ€กေแพแ€€ာแ€„္းแ€€ name variable แ‡ဲแ‚• แ€แ€”္แ€–ိုးแ€€ို แ€‘ုแ€္ျแ€•ေแ€•းแ€–ုိแ‚”ျแ€–แ€…္แ€•ါแ€แ€š္။

แ€’ါေแพแ€€ာแ€„့္ေแ€”ာแ€€္แ€†ံုး result แ€กေแ€”แ€”ဲแ‚” user แ€Ÿာ แ€กဲแ€’ီ input element แ€™ွာ แ€›ိုแ€€္แ€žแ€™ွ် ေแ€กာแ€€္แ€€ H1 tag แ€‘ဲแ€™ွာแ€œာေแ€•แšแ€•ါแ€œိแ€™္แ‚”แ€™แ€š္။

example demo: http://www.w3schools.com/angular/tryit.asp?filename=try_ng_default

แ€กေျแ€แ€ံแ€•ိုแ€„္းแ€™ွာ angularjs แ€Ÿာ แ€œြแ€š္แ€€ူေแ€•แ€™แ€š့္ advance แ€•ိုแ€„္းေแ€›ာแ€€္แ€œာแ€ဲแ‚”แ€กแ€ါ แ€กแ€แ€€္แ€กแ€ဲ แ€”แ€Š္းแ€”แ€Š္းေแ€ာแ‚”ေแ€ြแ‚”แ€›ႏိုแ€„္แ€•ါแ€แ€š္။ angularjs แ€€ေแ€•းแ€ဲแ‚” directive ေแ€ြแ€กျแ€•แ€„္ แ€€ိုแ€š္แ€•ိုแ€„္ directive ေแ€ြแ€แ€Š္ေแ€†ာแ€€္แ€œိုแ€ဲแ‚”แ€กแ€ါแ€™်ိဳးေแ€ြ แ€™ွာ ေแ€œแ‚”แ€œာแ€™ႈแ€•ိုแ€™ိုแ€œိုแ€กแ€•္แ€•ါแ€œိแ€™္แ‚”แ€™แ€š္။ javascript แ€€ို แ€•ိုแ€™ိုแ€”ားแ€œแ€Š္แ€›แ€”္แ€œแ€Š္းแ€œိုแ€•ါแ€แ€š္။

แ€€ြ်แ€”္ေแ€ာ္แ€€ိုแ€š္แ€ိုแ€„္แ€œแ€Š္း แ€กแ€ုแ€กแ€်ိแ€”္แ€™ွာ angular แ€€ို base level แ€กแ€‘ိေแ€œာแ€€္แ€•ဲေแ€›းႏိုแ€„္ေแ€žးแ€ာแ€•ါ။
แ€’ါေแพแ€€ာแ€„့္แ€…แ€แ€„္ေแ€œแ‚”แ€œာแ€™แ€š့္ แ€Šီแ€กแ€€ိုေแ€ြแ€กแ€ြแ€€္ แ€—แ€Ÿုแ€žုแ€ေแ€œးแ€•ါ။
แ€•ိုแ€žိแ€œာแ€ဲแ‚”แ€กแ€ါ แ€•ိုแ€™ို แ€™ွ်ေแ€แ€•ါแ‚”แ€™แ€š္။
Previous
Next Post »

Thorium School

Thorium School
Be professional with us