එය තේරුම් ගැනීම සඳහා AngularJS ක්රියා කරන ආකාරය පිළිබඳව ඔබ දැනුවත් විය යුතුය.
ඩයිජෙස්ට් චක්රය සහ $ විෂය පථය
පළමුවෙන්ම හා ප්රධාන වශයෙන් AngularJS විසින් ඊනියා ඩයිජෙස්ට් චක්රයේ සංකල්පයක් අර්ථ දක්වයි . මෙම චක්රය ලූපයක් ලෙස සැලකිය හැකි අතර, ඒ අතරතුර AngularJS විසින් සියළුම s විසින් නරඹන ලද සියලු විචල්යයන්හි යම් වෙනසක් තිබේදැයි පරීක්ෂා කරයි $scope
. එබැවින් ඔබ $scope.myVar
ඔබේ පාලකයේ අර්ථ දක්වා ඇති අතර මෙම විචල්යය නැරඹීම සඳහා සලකුණු කර ඇත්නම්, එවිට ඔබ ඇඟවුම් කරන්නේ AngularJS හි සිදුවන වෙනස්කම් නිරීක්ෂණය කරන ලෙසයිmyVar
ලූපයේ එක් එක් පුනරාවර්තනයේ .
ස්වාභාවික පසු විපරම් ප්රශ්නයක් වනුයේ: සියල්ල $scope
නැරඹීමට බැඳී තිබේද? වාසනාවකට මෙන්, නැත. ඔබගේ සෑම වස්තුවකම වෙනස්කම් සඳහා ඔබ බලා සිටින්නේ නම් $scope
, ඉක්මණින් ඩයිජෙස්ට් ලූපයක් ඇගයීමට වයස් ගත වන අතර ඔබ ඉක්මනින් කාර්ය සාධන ගැටළු වලට මුහුණ දෙනු ඇත. AngularJS කණ්ඩායම අපට යම් $scope
විචල්යයක් නැරඹිය හැකි යැයි ප්රකාශ කිරීමට ක්රම දෙකක් ලබා දුන්නේ එබැවිනි (පහත කියවන්න).
$ ඔරලෝසුව සවන් දීමට උපකාරී වේ $ විෂය පථයේ වෙනස්කම්
$scope
විචල්යයක් නැරඹිය හැකි යැයි ප්රකාශ කිරීමට ක්රම දෙකක් තිබේ .
- ප්රකාශනය හරහා එය ඔබගේ අච්චුවේ භාවිතා කිරීමෙන්
<span>{{myVar}}</span>
- එය අතින් එකතු කිරීමෙන්
$watch
සේවාව
දැන්වීම 1) මෙය වඩාත් සුලභ සිදුවීමක් වන අතර ඔබ එය මීට පෙර දැක ඇති බව මට විශ්වාසයි, නමුත් මෙය පසුබිමේ ඔරලෝසුවක් නිර්මාණය කර ඇති බව ඔබ දැන සිටියේ නැත. ඔව්, එය තිබුණා! AngularJS විධානයන් භාවිතා කිරීම (වැනි ng-repeat
) ද ව්යාජ ඔරලෝසු නිර්මාණය කළ හැකිය.
දැන්වීම 2) ඔබ ඔබේම ඔරලෝසු සාදන ආකාරය මෙයයි . $watch
යම් අගයක් අමුණා ඇති විට යම් කේතයක් ධාවනය කිරීමට සේවාව ඔබට උපකාරී $scope
වේ. එය කලාතුරකින් භාවිතා වන නමුත් සමහර විට එය ප්රයෝජනවත් වේ. උදාහරණයක් ලෙස, 'myVar' වෙනස් වන සෑම අවස්ථාවකම ඔබට යම් කේතයක් ධාවනය කිරීමට අවශ්ය නම්, ඔබට පහත සඳහන් දෑ කළ හැකිය:
function MyController($scope) {
$scope.myVar = 1;
$scope.$watch('myVar', function() {
alert('hey, myVar has changed!');
});
$scope.buttonClicked = function() {
$scope.myVar = 2; // This will trigger $watch expression to kick in
};
}
$ අයදුම් කිරීමෙන් ඩයිජෙස්ට් චක්රය සමඟ වෙනස්කම් ඒකාබද්ධ කිරීමට හැකියාව ලැබේ
$apply
ක්රියාකාරීත්වය ඒකාබද්ධ කිරීමේ යාන්ත්රණයක් ලෙස ඔබට සිතිය හැකිය . ඔබ දකින සෑම අවස්ථාවකම ඔබ නැරඹූ විචල්යය වෙනස් කර ඇත$scope
වස්තුවට කෙලින්ම ඔරලෝසුවක් , වෙනස සිදුවී ඇති බව AngularJS දැන ගනු ඇත. එයට හේතුව AngularJS දැනටමත් එම වෙනස්කම් නිරීක්ෂණය කිරීමට දැන සිටි බැවිනි. එබැවින් එය රාමුව මඟින් කළමනාකරණය කරන කේතයකින් සිදුවුවහොත්, ඩයිජෙස්ට් චක්රය දිගටම කරගෙන යනු ඇත.
කෙසේ වෙතත්, සමහර විට ඔබට AngularJS ලෝකයෙන් පිටත යම් අගයක් වෙනස් කිරීමට අවශ්ය වන අතර වෙනස්කම් සාමාන්යයෙන් ව්යාප්ත වේ. මෙය සළකා බලන්න - ඔබට $scope.myVar
වටිනාකමක් ඇති අතර එය jQuery $.ajax()
හසුරුවන්නෙකු තුළ වෙනස් කරනු ඇත . මෙය අනාගතයේ යම් අවස්ථාවක සිදුවනු ඇත. AngularJS හට මෙය සිදුවන තෙක් බලා සිටිය නොහැක, මන්ද එය jQuery හි රැඳී සිටීමට උපදෙස් දී නොමැත.
මෙය විසඳීම $apply
සඳහා හඳුන්වා දී ඇත. ආහාර ජීර්ණ චක්රය පැහැදිලිවම ආරම්භ කිරීමට එය ඔබට ඉඩ සලසයි. කෙසේ වෙතත්, ඔබ මෙය භාවිතා කළ යුත්තේ සමහර දත්ත AngularJS වෙත සංක්රමණය කිරීම සඳහා පමණි (වෙනත් රාමු සමඟ ඒකාබද්ධ කිරීම), නමුත් කිසි විටෙකත් සාමාන්ය AngularJS කේතය සමඟ ඒකාබද්ධව මෙම ක්රමය භාවිතා නොකරන්න, මන්ද AngularJS එවිට දෝෂයක් ඇති කරයි.
මේ සියල්ල DOM හා සම්බන්ධ වන්නේ කෙසේද?
හොඳයි, ඔබ නැවත වරක් නිබන්ධනය අනුගමනය කළ යුතුය, දැන් ඔබ මේ සියල්ල දනී. $scope
කිසිවක් වෙනස් නොවන තාක් කල් සියල්ලටම අනුයුක්ත කර ඇති සෑම මුරකරුවෙකුම තක්සේරු කිරීමෙන් UI සහ JavaScript කේතය සමමුහුර්තව පවතින බව ඩයිජෙස්ට් චක්රය සහතික කරයි . ඩයිජෙස්ට් ලූපයේ තවත් වෙනස්කම් සිදු නොවන්නේ නම්, එය අවසන් යැයි සැලකේ.
ඔබ වෙත වස්තූන් අනුයුක්ත හැකි $scope
පාලක, හෝ ඔවුන් ප්රකාශ කරමින් එක්කෝ සුවිශේෂව වස්තුව {{expression}}
මතය කෙලින්ම පත්රය.
මේ සියල්ල පිළිබඳ මූලික දැනුමක් පැහැදිලි කිරීමට එය උපකාරී වනු ඇතැයි මම බලාපොරොත්තු වෙමි.
වැඩිදුර කියවීම්: