top of page

ලේසියෙන්ම MEAN ඉගෙන ගනිමු. (Part - 4)


Controllers

මේ ලිපියෙන් අපි කතා කරන්න යන්නෙ කොහොමද අපේ application එකට අදාලව controllers use කරන්නෙ කියන එක ගැන.

Angular වලදි අපිට අවශ්‍ය ලෙස controllers පාවිච්චි කරන්න පුලුවන්.

මුලින්ම අපි public folder එක ඇතුලෙ තවත් folder එකක් හදා ගනිමු controllers කියල.

දැන් අපිට ඕනෙ කරන controllers වලට අදාල code එක ලියන්න mainController.js කියන file එක හදා ගන්න ඕනෙ.

මේ javaScript file එක අපිට පුලුවන් සාමාන්‍ය විදියට index.html file එකට link කරන්න.

<script type="text/javascript" src="./controllers/mainController.js"></script>

ඒ file එකේ content එක ගැන කතා කරන්න කලින් අපි index.html එකට අලුතෙන් content එකක් add කරගනිමු.

මේ code එකේදි අපිට තව අලුත් දේවල් කිහිපයක්ම හමු වෙනව. අපි මෙතනදි කරන්න යන්නෙ form එක submit කලාම form එකේ fill කරල තියන values ටික controller එක ඇතුලෙදි object එකකට අදාලව store කරල තියාගන්න එක.

මේ දේ කරගන්නෙ කොහොමද කියල දැන් බලමු.

ng-controller = “simpleController”

මේ කොටසෙන් වෙන්නෙ අපි ගනුදෙනු කරන්න යන්නෙ මොන controller එකත් එක්කද කියල හරියටම කියන එක. මේ form එකට අදාලවනම් simpleController කියන controller එක තමයි පාවිච්චි කරන්නෙ.

(controller එකට අදාල content එක ගැන ඉදිරියේදී කතා කරමු.)

ng-submit = “userData()”

මේකෙදි කියන්නෙ controller එකේ තියන function වලින් run වෙන්න ඕනෙ function එක මොකද්ද කියල කියන එක. මේකට අනුවනම් userData() කියන function එක තමයි run වෙන්න ඕනෙ.

මේ තියෙන්නෙ mainController.js file එකට එන්න ඕනෙ code එක.

අපි කලින් කතා කරපු simpleController කියන controller එක සහ userData() function එක දැක ගන්න පුලුවන්.

angular.module

මේකෙදි වෙන්නෙ අපේ application එක register කරන එක. HTML file එකේ ng-app කියන එකට දුන්න value එකම තමයි මෙතනටත් දෙන්න ඕනෙ

var app = angular.module('meanApp', []);

$scope

Controller එකෙන් view එක access කරන්න තමයි $scope කියන එක පාවිච්චි කරන්නෙ. මේක හරහා අපිට පුලුවන් අපි හදාගත්ත uData කියන object එක ලබාගන්න. මේකෙන් userData කියන function එක bind කරල තියාගන්න එකත් කරනව.

මේ form එක fill කරල submit කලාම අපිට browser එකේ console එකෙන් බලාගන්න පුලුවන් අපි දුන්න data මේ angular application එකෙන් object එකක් විදියට අරන් තියන ආකාරය.

අපි මේ application එකට node.js පාවිච්චි කරන විදිය සහ mongoDB පාවිච්චි කරන විදිය ඊළඟ ලිපියෙන් සලකා බලමු.


bottom of page