{"id":79767,"date":"2024-10-02T08:57:30","date_gmt":"2024-10-02T01:57:30","guid":{"rendered":"https:\/\/itviec.com\/blog\/?p=79767"},"modified":"2024-10-02T08:57:30","modified_gmt":"2024-10-02T01:57:30","slug":"angularjs-la-gi","status":"publish","type":"post","link":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/","title":{"rendered":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_84 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">N\u1ed9i dung b\u00e0i vi\u1ebft<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#AngularJS_la_gi\" >AngularJS l\u00e0 g\u00ec?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#Mot_so_diem_noi_bat_cua_AngularJS\" >M\u1ed9t s\u1ed1 \u0111i\u1ec3m n\u1ed5i b\u1eadt c\u1ee7a AngularJS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#Uu_va_nhuoc_diem_cua_AngularJS\" >\u01afu v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a AngularJS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#AngularJS_hoat_dong_nhu_the_nao\" >AngularJS ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#Cac_tinh_nang_noi_bat_cua_AngularJS\" >C\u00e1c t\u00ednh n\u0103ng n\u1ed5i b\u1eadt c\u1ee7a AngularJS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#Cau_hoi_thuong_gap_ve_AngularJS\" >C\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 AngularJS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#Tong_ket\" >T\u1ed5ng k\u1ebft<\/a><\/li><\/ul><\/nav><\/div>\n<p><em><strong>AngularJS l\u00e0 m\u1ed9t framework JavaScript m\u00e3 ngu\u1ed3n m\u1edf gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n web b\u1eb1ng c\u00e1ch t\u1ea1o c\u00e1c \u1ee9ng d\u1ee5ng trang t\u01b0\u01a1ng t\u00e1c (SPA). AngularJS s\u1ebd \u0111\u1ea3m b\u1ea3o c\u00e1c \u1ee9ng d\u1ee5ng web c\u1ee7a b\u1ea1n lu\u00f4n hi\u1ec7n \u0111\u1ea1i v\u00e0 hi\u1ec7u qu\u1ea3. V\u1eady Angular JS ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o v\u00e0 c\u00f3 nh\u1eefng \u01b0u \u0111i\u1ec3m g\u00ec?<\/strong><\/em><\/p>\n<p><span style=\"font-weight: 400;\">\u0110\u1ecdc b\u00e0i vi\u1ebft sau \u0111\u00e2y \u0111\u1ec3 t\u00ecm hi\u1ec3u chi ti\u1ebft h\u01a1n v\u1ec1:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">T\u1ed5ng quan v\u1ec1 AngularJS bao g\u1ed3m kh\u00e1i ni\u1ec7m, \u0111i\u1ec3m m\u1ea1nh, \u0111i\u1ec3m y\u1ebfu v\u00e0 c\u00e1ch ho\u1ea1t \u0111\u1ed9ng<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">M\u1ed9t s\u1ed1 t\u00ednh n\u0103ng n\u1ed5i b\u1eadt v\u00e0 \u1ee9ng d\u1ee5ng c\u1ee7a AngularJS<\/span><\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"AngularJS_la_gi\"><\/span><b>AngularJS l\u00e0 g\u00ec?<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">Angular JS \u0111\u01b0\u1ee3c bi\u1ebft l\u00e0 m\u1ed9t framework m\u00e3 ngu\u1ed3n m\u1edf gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n web b\u1eb1ng c\u00e1ch t\u1ea1o ra \u1ee9ng d\u1ee5ng trang t\u01b0\u01a1ng t\u00e1c SPA (single-page application). SPA s\u1ebd cung c\u1ea5p tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng m\u01b0\u1ee3t m\u00e0 h\u01a1n b\u1eb1ng c\u00e1ch c\u1eadp nh\u1eadt n\u1ed9i dung tr\u00ean c\u00f9ng m\u1ed9t trang. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Angular JS s\u1ebd gi\u00fap trang web tr\u1edf n\u00ean m\u01b0\u1ee3t m\u00e0 h\u01a1n b\u1eb1ng c\u00e1ch cung c\u1ea5p m\u1ed9t b\u1ed9 c\u00e1c directive v\u00e0 bi\u1ec3u th\u1ee9c \u0111\u1ec3 b\u1ea1n c\u00f3 th\u1ec3 t\u1ea1o ra c\u00e1c ph\u1ea7n t\u1eed HTML \u0111\u1ed9ng v\u00e0 t\u01b0\u01a1ng t\u00e1c. C\u00e1c t\u00ednh n\u0103ng nh\u01b0 li\u00ean k\u1ebft d\u1eef li\u1ec7u, dependency injection, templating, routing, \u2026 s\u1ebd gi\u00fap b\u1ea1n ti\u1ebft ki\u1ec7m th\u1eddi gian v\u00e0 c\u00f4ng s\u1ee9c h\u01a1n.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">AngularJS trong <\/span><strong><a href=\"https:\/\/itviec.com\/blog\/javascript-la-gi\/\" target=\"_blank\" rel=\"noopener\">JavaScript<\/a><\/strong><span style=\"font-weight: 400;\"> framework c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng theo hai c\u00e1ch l\u00e0: <\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng Angular CLI v\u00e0 NPM.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng li\u00ean k\u1ebft CDN trong th\u1ebb &lt;script&gt;<\/span><\/li>\n<\/ul>\n<pre><span style=\"font-weight: 400;\">&lt;script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/angular.js\/1.8.3\/angular.min.js\" <\/span>\r\n<span style=\"font-weight: 400;\">             integrity=\"sha512-KZmyTq3PLx9EZl0RHShHQuXtrvdJ+m35tuOiwlcZfs\/rE7NZv29ygNA8SFCkMXTnYZQK2OX0Gm2qKGfvWEtRXA==\" <\/span>\r\n<span style=\"font-weight: 400;\">             crossorigin=\"anonymous\" referrerpolicy=\"no-referrer\"&gt;<\/span>\r\n<span style=\"font-weight: 400;\">&lt;\/script&gt;<\/span><\/pre>\n<p><span style=\"font-weight: 400;\">Trong \u0111\u00f3 1.8.3 l\u00e0 phi\u00ean b\u1ea3n Angular m\u00e0 b\u1ea1n mu\u1ed1n s\u1eed d\u1ee5ng. V\u00ed d\u1ee5 minh h\u1ecda \u1ee9ng d\u1ee5ng Hello World c\u01a1 b\u1ea3n b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng AngularJS nh\u01b0:<\/span><\/p>\n<pre><span style=\"font-weight: 400;\">&lt;!DOCTYPE html&gt;<\/span>\r\n<span style=\"font-weight: 400;\">&lt;html ng-app=\"myApp\"&gt;<\/span>\r\n<span style=\"font-weight: 400;\">&lt;head&gt;<\/span>\r\n<span style=\"font-weight: 400;\">  &lt;script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.8.2\/angular.min.js\"&gt;&lt;\/script&gt;<\/span>\r\n<span style=\"font-weight: 400;\">&lt;\/head&gt;<\/span>\r\n\r\n<span style=\"font-weight: 400;\">&lt;body&gt;<\/span>\r\n<span style=\"font-weight: 400;\">  &lt;div ng-controller=\"myController\"&gt;   <\/span>\r\n<span style=\"font-weight: 400;\">    &lt;h1&gt;Hello, {{name}}!&lt;\/h1&gt;<\/span>\r\n<span style=\"font-weight: 400;\">  &lt;\/div&gt;<\/span>\r\n\r\n<span style=\"font-weight: 400;\">  &lt;script&gt;<\/span>\r\n<span style=\"font-weight: 400;\">  var app = angular.module('myApp', []);<\/span>\r\n<span style=\"font-weight: 400;\">  app.controller('myController', function($scope) {<\/span>\r\n<span style=\"font-weight: 400;\">    $scope.name = 'World';<\/span>\r\n<span style=\"font-weight: 400;\">  });<\/span>\r\n<span style=\"font-weight: 400;\">  &lt;\/script&gt;<\/span>\r\n\r\n<span style=\"font-weight: 400;\">&lt;\/body&gt;<\/span>\r\n\r\n<span style=\"font-weight: 400;\">&lt;\/html&gt;<\/span><\/pre>\n<h2><span class=\"ez-toc-section\" id=\"Mot_so_diem_noi_bat_cua_AngularJS\"><\/span><b> M\u1ed9t s\u1ed1 \u0111i\u1ec3m n\u1ed5i b\u1eadt c\u1ee7a AngularJS<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">M\u1ed9t s\u1ed1 t\u00ednh n\u0103ng n\u1ed5i b\u1eadt c\u1ee7a AngularJS c\u00f3 th\u1ec3 k\u1ec3 \u0111\u1ebfn nh\u01b0:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>MVC:<\/b><span style=\"font-weight: 400;\"> AngularJS ho\u1ea1t \u0111\u1ed9ng b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng ki\u1ebfn tr\u00fac MVC \u0111\u1ec3 x\u00e2y d\u1ef1ng c\u00e1c \u1ee9ng d\u1ee5ng web. Trong MVC, logic n\u1eb1m trong ba ph\u1ea7n ch\u00ednh l\u00e0 model, view v\u00e0 controller. \u0110i\u1ec1u n\u00e0y s\u1ebd gi\u00fap \u1ee9ng d\u1ee5ng web AngularJS d\u1ec5 qu\u1ea3n l\u00fd v\u00e0 m\u1ea1nh m\u1ebd h\u01a1n.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Li\u00ean k\u1ebft m\u00f4 h\u00ecnh d\u1eef li\u1ec7u:<\/b><span style=\"font-weight: 400;\"> Thay v\u00ec vi\u1ebft m\u00e3 ph\u1ee9c t\u1ea1p v\u00e0 d\u00e0i d\u00f2ng, AngularJS cho ph\u00e9p b\u1ea1n th\u1ef1c hi\u1ec7n d\u1ec5 d\u00e0ng v\u1edbi c\u00e1c \u0111o\u1ea1n m\u00e3 JavaScript \u0111\u01a1n gi\u1ea3n v\u00e0 ch\u1ec9 th\u1ecb t\u01b0\u01a1ng \u1ee9ng c\u1ee7a ch\u00fang trong c\u00e1c \u0111\u1ed1i t\u01b0\u1ee3ng HTML.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>\u00cdt m\u00e3 h\u01a1n:<\/b><span style=\"font-weight: 400;\"> Thay v\u00ec ph\u1ea3i s\u1eed d\u1ee5ng nhi\u1ec1u m\u00e3 JavaScript \u0111\u1ec3 thao t\u00e1c m\u00f4 h\u00ecnh DOM, v\u1edbi AngularJS b\u1ea1n c\u00f3 th\u1ec3 vi\u1ebft \u00edt m\u00e3 h\u01a1n \u0111\u1ec3 \u0111\u1ea1t \u0111\u01b0\u1ee3c \u0111i\u1ec1u t\u01b0\u01a1ng t\u1ef1.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Unit Testing:<\/b><span style=\"font-weight: 400;\"> \u0110\u1ec3 th\u1ef1c hi\u1ec7n ki\u1ec3m tra \u0111\u01a1n v\u1ecb, b\u1ea1n c\u00f3 th\u1ec3 th\u1ef1c hi\u1ec7n b\u00e0i ki\u1ec3m th\u1eed \u0111\u01a1n v\u1ecb trong AngularJS v\u1edbi khu\u00f4n kh\u1ed5 Karma. <\/span><\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Uu_va_nhuoc_diem_cua_AngularJS\"><\/span><b>\u01afu v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a AngularJS<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">M\u1ed9t s\u1ed1 \u0111i\u1ec3m m\u1ea1nh c\u1ee7a Angular JS c\u00f3 th\u1ec3 k\u1ec3 \u0111\u1ebfn nh\u01b0:<\/span><\/p>\n<ul>\n<li>M\u00e3 ngu\u1ed3n m\u1edf cho ph\u00e9p ng\u01b0\u1eddi d\u00f9ng tr\u1ea3i nghi\u1ec7m c\u00e1c v\u1ea5n \u0111\u1ec1 ho\u1eb7c l\u1ed7 h\u1ed5ng c\u1ee7a Angular JS.<\/li>\n<li>Cung c\u1ea5p li\u00ean k\u1ebft hai chi\u1ec1u, gi\u00fap \u0111\u1ed3ng b\u1ed9 h\u00f3a d\u1eef li\u1ec7u v\u00e0 presentation layer t\u1ed1i \u01b0u. V\u1edbi t\u00ednh n\u0103ng n\u00e0y, b\u1ea1n s\u1ebd kh\u00f4ng c\u1ea7n ph\u1ea3i vi\u1ebft th\u00eam m\u00e3 JavaScript ch\u1ec9 \u0111\u1ec3 gi\u1eef d\u1eef li\u1ec7u trong HTML v\u00e0 l\u1edbp d\u1eef li\u1ec7u c\u1ee7a b\u1ea1n s\u1ebd \u0111\u01b0\u1ee3c t\u1ef1 \u0111\u1ed9ng h\u00f3a.<\/li>\n<li>Th\u01b0 vi\u1ec7n Angular JS v\u1edbi nhi\u1ec1u thi\u1ebft k\u1ebf h\u1ea5p d\u1eabn gi\u00fap h\u1ed7 tr\u1ee3 developer trong vi\u1ec7c ph\u00e1t tri\u1ec3n giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng.<\/li>\n<li>\u1ee8ng d\u1ee5ng \u0111\u01b0\u1ee3c n\u00e2ng c\u1ea5p v\u1edbi dung l\u01b0\u1ee3ng nh\u1eb9 h\u01a1n so v\u1edbi c\u00e1c \u1ee9ng d\u1ee5ng kh\u00e1c.<\/li>\n<li>Angular JS h\u1ed7 tr\u1ee3 th\u1eed nghi\u1ec7m \u0111\u01a1n v\u1ecb (unit testing) v\u00e0 th\u1eed nghi\u1ec7m t\u00edch h\u1ee3p (integration testing)<\/li>\n<\/ul>\n<p>Nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a AngularJS:<\/p>\n<ul>\n<li>Kh\u00e1i ni\u1ec7m c\u1ee7a Angular JS kh\u00f3 h\u1ecdc h\u01a1n so v\u1edbi c\u00e1c framework kh\u00e1c.<\/li>\n<li>Ph\u1ea7n m\u1ec1m ph\u1ee9c t\u1ea1p v\u00e0 nhi\u1ec1u th\u1eed th\u00e1ch. B\u1edfi v\u00ec kh\u00f3 qu\u1ea3n l\u00fd v\u00e0 b\u1ea3o tr\u00ec n\u00ean Angular JS th\u01b0\u1eddng bao g\u1ed3m th\u01b0 vi\u1ec7n c\u0169ng nh\u01b0 c\u00fa ph\u00e1p c\u1ee7a b\u00ean th\u1ee9 ba.<\/li>\n<li>Kh\u00f4ng c\u00f2n \u0111\u01b0\u1ee3c ph\u00e1t tri\u1ec3n t\u00edch c\u1ef1c: Google \u0111\u00e3 chuy\u1ec3n sang Angular (phi\u00ean b\u1ea3n 2 tr\u1edf l\u00ean) v\u1edbi nhi\u1ec1u c\u1ea3i ti\u1ebfn.<\/li>\n<li>\u0110\u1ed1i v\u1edbi c\u00e1c \u1ee9ng d\u1ee5ng l\u1edbn v\u00e0 ph\u1ee9c t\u1ea1p, AngularJS c\u00f3 th\u1ec3 g\u1eb7p m\u1ed9t s\u1ed1 v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t.<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"AngularJS_hoat_dong_nhu_the_nao\"><\/span><b>AngularJS ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">AngularJS ho\u1ea1t \u0111\u1ed9ng d\u1ef1a tr\u00ean ki\u1ebfn tr\u00fac MVC (model-view-controller). MVC l\u00e0 m\u1ed9t m\u00f4 h\u00ecnh ph\u00e1t tri\u1ec3n web ph\u1ed5 bi\u1ebfn trong h\u1ea7u h\u1ebft m\u1ecdi \u1ee9ng d\u1ee5ng web, ch\u00fang ho\u1ea1t \u0111\u1ed9ng nh\u01b0 sau:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Model (M):<\/b><span style=\"font-weight: 400;\"> \u0110\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 bi\u1ec3u di\u1ec5n d\u1eef li\u1ec7u. Ch\u1eb3ng h\u1ea1n trong \u1ee9ng d\u1ee5ng gi\u1ecf h\u00e0ng, m\u00f4 h\u00ecnh (model) s\u1ebd bi\u1ec3u di\u1ec5n cho s\u1ea3n ph\u1ea9m. M\u1ed7i s\u1ea3n ph\u1ea9m c\u00f3 th\u1ec3 c\u00f3 ID, t\u00ean, gi\u00e1 v\u00e0 h\u00e0ng t\u1ed3n kho \u0111\u01b0\u1ee3c l\u01b0u tr\u1eef trong c\u01a1 s\u1edf d\u1eef li\u1ec7u.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>View (V)<\/b><span style=\"font-weight: 400;\"> l\u00e0 l\u1edbp giao di\u1ec7n c\u1ee7a ph\u1ea7n m\u1ec1m. Khi b\u1ea1n truy c\u1eadp trang web, v\u1ec1 c\u01a1 b\u1ea3n ch\u00ednh l\u00e0 b\u1ea1n \u0111ang t\u01b0\u01a1ng t\u00e1c v\u1edbi y\u1ebfu t\u1ed1 V trong MVC c\u1ee7a trang \u0111\u00f3.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Controller \u00a9<\/b><span style=\"font-weight: 400;\">: L\u00e0 l\u1edbp logic trong MVC.Trong khung nh\u00ecn, ng\u01b0\u1eddi d\u00f9ng cu\u1ed1i c\u1ee7a ph\u1ea7n m\u1ec1m k\u00edch ho\u1ea1t c\u00e1c h\u00e0m \u0111\u01b0\u1ee3c l\u01b0u tr\u1eef trong b\u1ed9 \u0111i\u1ec1u khi\u1ec3n. B\u1ed9 \u0111i\u1ec1u khi\u1ec3n s\u1ebd x\u1eed l\u00fd vi\u1ec7c c\u1eadp nh\u1eadt m\u00f4 h\u00ecnh \u1edf ch\u1ebf \u0111\u1ed9 n\u1ec1n. <\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">AngularJS framework th\u1ef1c thi m\u00f4 h\u00ecnh MVC theo thi\u1ebft k\u1ebf. Vi\u1ec7c x\u00e2y d\u1ef1ng trang web theo m\u00f4 h\u00ecnh MVC s\u1ebd gi\u00fap ph\u00e2n bi\u1ec7t r\u00f5 r\u00e0ng c\u00e1c ph\u1ea7n kh\u00e1c nhau c\u1ee7a \u1ee9ng d\u1ee5ng, gi\u00fap ph\u00e1t tri\u1ec3n d\u1ec5 d\u00e0ng h\u01a1n v\u00e0 qu\u1ea3n l\u00fd \u1ee9ng d\u1ee5ng kh\u1ea3 thi h\u01a1n. <\/span><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Cac_tinh_nang_noi_bat_cua_AngularJS\"><\/span><b> C\u00e1c t\u00ednh n\u0103ng n\u1ed5i b\u1eadt c\u1ee7a AngularJS <\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">M\u1ed9t s\u1ed1 t\u00ednh n\u0103ng c\u01a1 b\u1ea3n c\u1ee7a AngularJS th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi l\u1eadp tr\u00ecnh web nh\u01b0:<\/span><\/p>\n<ul>\n<li><b>modules:<\/b><span style=\"font-weight: 400;\"> \u0110\u1ecbnh ngh\u0129a m\u1ed9t \u1ee9ng d\u1ee5ng v\u00e0 l\u00e0 v\u00f9ng ch\u1ee9a cho c\u00e1c ph\u1ea7n kh\u00e1c nhau. \u0110\u1ec3 t\u1ea1o m\u1ed9t module, b\u1ea1n c\u00f3 th\u1ec3 d\u00f9ng angular.module, t\u01b0\u01a1ng t\u1ef1 khi th\u00eam m\u1ed9t b\u1ed9 \u0111i\u1ec1u khi\u1ec3n v\u00e0o \u1ee9ng d\u1ee5ng v\u00e0 tham chi\u1ebfu \u0111\u1ebfn b\u1ed9 \u0111i\u1ec1u khi\u1ec3n b\u1eb1ng ch\u1ec9 th\u1ecb ng-controller.<\/span><\/li>\n<li><b>scope:<\/b><span style=\"font-weight: 400;\"> Ph\u1ea7n li\u00ean k\u1ebft gi\u1eefa HTML (view) v\u00e0 JavaScript (controller), l\u00e0 m\u1ed9t \u0111\u1ed1i t\u01b0\u1ee3ng c\u00f3 c\u00e1c thu\u1ed9c t\u00ednh c\u0169ng nh\u01b0 ph\u01b0\u01a1ng th\u1ee9c kh\u1ea3 d\u1ee5ng. Khi b\u1ea1n mu\u1ed1n t\u1ea1o controller trong AngularJS, b\u1ea1n s\u1ebd c\u1ea7n truy\u1ec1n \u0111\u1ed1i t\u01b0\u1ee3ng $scope \u0111\u1ec3 l\u00e0m \u0111\u1ed1i s\u1ed1.<\/span><\/li>\n<li><b>controller<\/b><span style=\"font-weight: 400;\">: Ki\u1ec3m so\u00e1t d\u1eef li\u1ec7u c\u1ee7a c\u00e1c \u1ee9ng d\u1ee5ng AngularJS, ch\u1ec9 th\u1ecb ng-controller s\u1ebd \u0111\u1ecbnh ngh\u0129a b\u1ed9 \u0111i\u1ec1u khi\u1ec3n \u1ee9ng d\u1ee5ng. Controller th\u01b0\u1eddng l\u00e0 \u0111\u1ed1i t\u01b0\u1ee3ng JavaScript, \u0111\u01b0\u1ee3c t\u1ea1o b\u1edfi tr\u00ecnh x\u00e2y d\u1ef1ng \u0111\u1ed1i t\u01b0\u1ee3ng JavaScript chu\u1ea9n. <\/span><\/li>\n<li><b>directive: <\/b><span style=\"font-weight: 400;\">Cho ph\u00e9p m\u1edf r\u1ed9ng HTML v\u1edbi c\u00e1c thu\u1ed9c t\u00ednh g\u1ecdi l\u00e0 ch\u1ec9 th\u1ecb (directive). Ch\u1ec9 th\u1ecb AngularJS l\u00e0 c\u00e1c thu\u1ed9c t\u00ednh HTML m\u1edf r\u1ed9ng v\u1edbi ti\u1ec1n t\u1ed1 ng-, c\u1ee5 th\u1ec3 nh\u01b0: <\/span><span style=\"font-weight: 400;\">ng-app<\/span><span style=\"font-weight: 400;\"> (kh\u1edfi t\u1ea1o \u1ee9ng d\u1ee5ng), <\/span><span style=\"font-weight: 400;\">ng-init<\/span><span style=\"font-weight: 400;\"> (kh\u1edfi t\u1ea1o d\u1eef li\u1ec7u), <\/span><span style=\"font-weight: 400;\">ng-model<\/span><span style=\"font-weight: 400;\"> (li\u00ean k\u1ebft gi\u00e1 tr\u1ecb c\u00e1c \u0111i\u1ec1u khi\u1ec3n HTML v\u1edbi d\u1eef li\u1ec7u \u1ee9ng d\u1ee5ng)<\/span><\/li>\n<li><b>expression: <\/b><span style=\"font-weight: 400;\">Bi\u1ec3u th\u1ee9c AngularJS c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c vi\u1ebft b\u00ean trong d\u1ea5u ngo\u1eb7c k\u00e9p {{expression}} ho\u1eb7c trong m\u1ed9t ch\u1ec9 th\u1ecb: ng-bind=\u201dexpression\u201d. AngularJS s\u1ebd gi\u1ea3i quy\u1ebft bi\u1ec3u th\u1ee9c v\u00e0 tr\u1ea3 v\u1ec1 k\u1ebft qu\u1ea3 ch\u00ednh x\u00e1c t\u1ea1i n\u01a1i bi\u1ec3u th\u1ee9c \u0111\u01b0\u1ee3c vi\u1ebft.<\/span><\/li>\n<li><b>filter:<\/b><span style=\"font-weight: 400;\"> C\u00f3 th\u1ec3 th\u00eam filter v\u00e0o AngularJS \u0111\u1ec3 \u0111\u1ecbnh d\u1ea1ng d\u1eef li\u1ec7u, m\u1ed9t s\u1ed1 filter \u0111\u1ec3 chuy\u1ec3n \u0111\u1ed5i d\u1eef li\u1ec7u trong AngularJS nh\u01b0 <\/span><span style=\"font-weight: 400;\">currency, date, filter, json, limitTo, lowercase, number, orderBy, uppercase,&#8230;<\/span><\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Cau_hoi_thuong_gap_ve_AngularJS\"><\/span><b>C\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 AngularJS<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><b>S\u1ef1 kh\u00e1c nhau gi\u1eefa AngularJS v\u00e0 ReactJS<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Angular v\u00e0 React \u0111\u1ec1u \u0111\u01b0\u1ee3c c\u00e1c doanh nghi\u1ec7p s\u1eed d\u1ee5ng \u0111\u1ec3 x\u00e2y d\u1ef1ng trang web c\u0169ng nh\u01b0 l\u1eadp tr\u00ecnh c\u00e1c \u1ee9ng d\u1ee5ng. Tuy nhi\u00ean, c\u1ea3 hai ng\u00f4n ng\u1eef \u0111\u1ec1u c\u00f3 m\u1ed9t s\u1ed1 kh\u00e1c bi\u1ec7t v\u00e0 th\u1ebf m\u1ea1nh ri\u00eang, c\u1ee5 th\u1ec3 nh\u01b0:<\/span><\/p>\n<table>\n<tbody>\n<tr>\n<td><\/td>\n<td><b>AngularJS<\/b><\/td>\n<td><b>ReactJS<\/b><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ph\u00e1t tri\u1ec3n b\u1edfi<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Google<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Facebook<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Th\u00e0nh l\u1eadp<\/span><\/td>\n<td><span style=\"font-weight: 400;\">2009<\/span><\/td>\n<td><span style=\"font-weight: 400;\">2013<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi<\/span><\/td>\n<td><span style=\"font-weight: 400;\">TypeScript<\/span><\/td>\n<td><span style=\"font-weight: 400;\">JavaScript<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Technology Type<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Khung MVC \u0111\u01b0\u1ee3c bi\u1ebft b\u1eb1ng JavaScript<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Th\u01b0 vi\u1ec7n JavaScript (xem trong MVC, y\u00eau c\u1ea7u Flux \u0111\u1ec3 tri\u1ec3n khai ki\u1ebfn tr\u00fac)<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Kh\u00e1i ni\u1ec7m<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0a JavaScript v\u00e0o HTML ho\u1ea1t \u0111\u1ed9ng v\u1edbi k\u1ebft xu\u1ea5t DOM \u1edf ph\u00eda m\u00e1y ch\u1ee7.<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0a HTML v\u00e0o ho\u1ea1t \u0111\u1ed9ng trong JavaScript v\u1edbi m\u00e1y ch\u1ee7 DOM \u1ea3o, k\u1ebft xu\u1ea5t \u1edf ph\u00eda m\u00e1y ch\u1ee7. <\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Li\u00ean k\u1ebft d\u1eef li\u1ec7u<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Li\u00ean k\u1ebft d\u1eef li\u1ec7u hai chi\u1ec1u<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Li\u00ean k\u1ebft d\u1eef li\u1ec7u m\u1ed9t chi\u1ec1u<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ng\u00f4n ng\u1eef<\/span><\/td>\n<td><span style=\"font-weight: 400;\">JavaScript + HTML<\/span><\/td>\n<td><span style=\"font-weight: 400;\">JavaScript +JSX<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">UI Rendering<\/span><\/td>\n<td><span style=\"font-weight: 400;\">M\u00e1y ch\u1ee7 kh\u00e1ch h\u00e0ng<\/span><\/td>\n<td><span style=\"font-weight: 400;\">M\u00e1y ch\u1ee7 kh\u00e1ch h\u00e0ng<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ph\u00f9 h\u1ee3p<\/span><\/td>\n<td><span style=\"font-weight: 400;\">C\u00e1c \u1ee9ng d\u1ee5ng web c\u00f3 s\u1ef1 t\u01b0\u01a1ng t\u00e1c v\u00e0 ho\u1ea1t \u0111\u1ed9ng cao<\/span><\/td>\n<td><span style=\"font-weight: 400;\">C\u00e1c \u1ee9ng d\u1ee5ng l\u1edbn h\u01a1n v\u1edbi d\u1eef li\u1ec7u bi\u1ebfn \u0111\u1ed5i \u0111\u1ecbnh k\u1ef3<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">C\u1ea5u tr\u00fac<\/span><\/td>\n<td><span style=\"font-weight: 400;\">MVC ph\u1ee9c t\u1ea1p<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Ch\u1ebf \u0111\u1ed9 xem d\u1ef1a tr\u00ean th\u00e0nh ph\u1ea7n linh ho\u1ea1t<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ph\u1ee5 thu\u1ed9c<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c h\u1ed7 tr\u1ee3 \u0111\u1ea7y \u0111\u1ee7<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Kh\u00f4ng \u0111\u01b0\u1ee3c h\u1ed7 tr\u1ee3<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Hi\u1ec7u su\u1ea5t<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Cao<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Cao<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">DOM<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Th\u1eadt<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u1ea2o<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<blockquote><p><em>\u0110\u1ecdc th\u00eam: <a href=\"https:\/\/itviec.com\/blog\/cau-hoi-phong-van-reactjs-la-gi\/\" target=\"_blank\" rel=\"noopener\"><strong>Top 40 c\u00e2u h\u1ecfi ph\u1ecfng v\u1ea5n ReactJS t\u1eeb c\u01a1 b\u1ea3n \u0111\u1ebfn n\u00e2ng cao<\/strong><\/a><\/em><\/p><\/blockquote>\n<h3><b>Angular v\u00e0 AngularJS c\u00f3 g\u00ec gi\u1ed1ng v\u00e0 kh\u00e1c nhau?<\/b><\/h3>\n<p><strong><a href=\"https:\/\/itviec.com\/blog\/angular-la-gi\/\" target=\"_blank\" rel=\"noopener\">Angular<\/a><\/strong><span style=\"font-weight: 400;\"> v\u00e0 <strong>AngularJS<\/strong> \u0111\u1ec1u ph\u1ee5c v\u1ee5 c\u00e1c m\u1ee5c \u0111\u00edch gi\u1ed1ng nhau trong ph\u00e1t tri\u1ec3n web. T\u00f9y thu\u1ed9c theo nhu c\u1ea7u v\u00e0 quy m\u00f4 d\u1ef1 \u00e1n m\u00e0 b\u1ea1n c\u00f3 th\u1ec3 l\u1ef1a ch\u1ecdn framework th\u00edch h\u1ee3p.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">M\u1ed9t s\u1ed1 \u0111i\u1ec3m kh\u00e1c nhau gi\u1eefa Angular v\u00e0 AngularJS nh\u01b0 sau:<\/span><\/p>\n<table>\n<tbody>\n<tr>\n<td><\/td>\n<td><b>AngularJS<\/b><\/td>\n<td><b>Angular<\/b><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ki\u1ebfn tr\u00fac<\/span><\/td>\n<td><span style=\"font-weight: 400;\">H\u1ed7 tr\u1ee3 thi\u1ebft k\u1ebf Model-View-Controller, gi\u00fap x\u1eed l\u00fd th\u00f4ng tin c\u00f3 s\u1eb5n trong model \u0111\u1ec3 t\u1ea1o \u0111\u1ea7u ra<\/span><\/td>\n<td><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng c\u00e1c th\u00e0nh ph\u1ea7n v\u00e0 ch\u1ec9 th\u1ecb, c\u00e1c th\u00e0nh ph\u1ea7n l\u00e0 c\u00e1c ch\u1ec9 th\u1ecb c\u00f3 m\u1eabu<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c vi\u1ebft b\u1eb1ng JavaScript<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c vi\u1ebft b\u1eb1ng ng\u00f4n ng\u1eef TypeScript c\u1ee7a Microsoft, l\u00e0 m\u1ed9t ph\u1ea7n nh\u1ecf c\u1ee7a ECMAScript 6 (ES6)<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">H\u1ed7 tr\u1ee3 di \u0111\u1ed9ng<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Kh\u00f4ng h\u1ed7 tr\u1ee3 tr\u00ecnh duy\u1ec7t di \u0111\u1ed9ng<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110\u01b0\u1ee3c h\u1ed7 tr\u1ee3 b\u1edfi t\u1ea5t c\u1ea3 c\u00e1c tr\u00ecnh duy\u1ec7t di \u0111\u1ed9ng ph\u1ed5 bi\u1ebfn<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">C\u00fa ph\u00e1p<\/span><\/td>\n<td><span style=\"font-weight: 400;\">ng.bind \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 li\u00ean k\u1ebft d\u1eef li\u1ec7u t\u1eeb ch\u1ebf \u0111\u1ed9 sang xem m\u00f4 h\u00ecnh v\u00e0 ng\u01b0\u1ee3c l\u1ea1i<\/span><\/td>\n<td><span style=\"font-weight: 400;\">C\u00e1c thu\u1ed9c t\u00ednh bao quanh b\u1edfi () v\u00e0 [] \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 li\u00ean k\u1ebft d\u1eef li\u1ec7u gi\u1eefa ch\u1ebf \u0111\u1ed9 xem v\u00e0 m\u00f4 h\u00ecnh.<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">Ng\u00f4n ng\u1eef \u0111\u01b0\u1ee3c h\u1ed7 tr\u1ee3<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Ch\u1ec9 h\u1ed7 tr\u1ee3 JavaScript<\/span><\/td>\n<td><span style=\"font-weight: 400;\">H\u1ed7 tr\u1ee3 cho TypeScript v\u00e0 JavaScript<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">\u0110\u1ecbnh tuy\u1ebfn<\/span><\/td>\n<td><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng $routeprovider.when() \u0111\u1ec3 c\u1ea5u h\u00ecnh \u0111\u1ecbnh tuy\u1ebfn<\/span><\/td>\n<td><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng RouterModule \u0111\u1ec3 c\u1ea5u h\u00ecnh \u0111\u1ecbnh tuy\u1ebfn<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">C\u1ea5u tr\u00fac<\/span><\/td>\n<td><span style=\"font-weight: 400;\">D\u1ec5 h\u01a1n qu\u1ea3n l\u00fd h\u01a1n so v\u1edbi Angular<\/span><\/td>\n<td><span style=\"font-weight: 400;\">C\u1ea5u tr\u00fac t\u1ed1t h\u01a1n AngularJS, d\u1ec5 t\u1ea1o v\u00e0 b\u1ea3o tr\u00ec h\u01a1n cho c\u00e1c \u1ee9ng d\u1ee5ng l\u1edbn. <\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">CLI<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Kh\u00f4ng \u0111i k\u00e8m v\u1edbi c\u00f4ng c\u1ee5 CLI<\/span><\/td>\n<td><span style=\"font-weight: 400;\">\u0110i k\u00e8m v\u1edbi c\u00f4ng c\u1ee5 Angular CLI<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">V\u00ed d\u1ee5, \u1ee9ng d\u1ee5ng<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Trang web ch\u00ednh th\u1ee9c c\u1ee7a iStock, Netflix ho\u1eb7c AngularJS<\/span><\/td>\n<td><span style=\"font-weight: 400;\">Upwork, Gmail hay Wikiwand<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2><span class=\"ez-toc-section\" id=\"Tong_ket\"><\/span><b>T\u1ed5ng k\u1ebft<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><b>AngularJS<\/b><span style=\"font-weight: 400;\"> l\u00e0 m\u1ed9t s\u1ef1 l\u1ef1a ch\u1ecdn th\u00edch h\u1ee3p cho c\u00e1c d\u1ef1 \u00e1n web quy m\u00f4 l\u1edbn v\u00e0 ph\u1ee9c t\u1ea1p. V\u1edbi c\u1ea5u tr\u00fac MVC r\u00f5 r\u00e0ng, kh\u1ea3 n\u0103ng r\u00e0ng bu\u1ed9c d\u1eef li\u1ec7u hai chi\u1ec1u v\u00e0 h\u1ec7 sinh th\u00e1i l\u1edbn, AngularJS gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh l\u1eadp tr\u00ecnh trang web.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">\u0110\u1ec3 th\u00e0nh th\u1ea1o l\u1eadp tr\u00ecnh c\u00f9ng AngularJS, b\u1ea1n n\u00ean th\u01b0\u1eddng xuy\u00ean th\u1ef1c h\u00e0nh c\u00f9ng c\u00e1c d\u1ef1 \u00e1n th\u1ef1c t\u1ebf c\u0169ng nh\u01b0 theo d\u00f5i c\u00e1c c\u1eadp nh\u1eadt m\u1edbi nh\u1ea5t c\u1ee7a ph\u1ea7n m\u1ec1m \u0111\u1ec3 \u0111\u1ea3m b\u1ea3o \u1ee9ng d\u1ee5ng c\u1ee7a b\u1ea1n lu\u00f4n \u0111\u01b0\u1ee3c \u0111\u1ea3m b\u1ea3o.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>AngularJS l\u00e0 m\u1ed9t framework JavaScript m\u00e3 ngu\u1ed3n m\u1edf gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n web b\u1eb1ng c\u00e1ch t\u1ea1o c\u00e1c \u1ee9ng d\u1ee5ng trang t\u01b0\u01a1ng t\u00e1c (SPA). AngularJS s\u1ebd \u0111\u1ea3m b\u1ea3o c\u00e1c \u1ee9ng d\u1ee5ng web c\u1ee7a b\u1ea1n lu\u00f4n hi\u1ec7n \u0111\u1ea1i v\u00e0 hi\u1ec7u qu\u1ea3. V\u1eady Angular JS ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o v\u00e0 c\u00f3 nh\u1eefng \u01b0u [&hellip;]<\/p>\n","protected":false},"author":207,"featured_media":79801,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_gspb_post_css":"","footnotes":""},"categories":[109],"tags":[],"class_list":["post-79767","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-chuyen-mon-it"],"blocksy_meta":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.8 (Yoast SEO v27.7) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng - ITviec Blog<\/title>\n<meta name=\"description\" content=\"AngularJS l\u00e0 m\u1ed9t m\u00e3 ngu\u1ed3n m\u1edf v\u00e0 framework cho c\u00e1c \u1ee9ng d\u1ee5ng web. T\u00ecm hi\u1ec3u chi ti\u1ebft v\u1ec1 c\u00e1ch ho\u1ea1t \u0111\u1ed9ng c\u0169ng nh\u01b0 kh\u00e1i ni\u1ec7m v\u1ec1 AngularJS ngay!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng\" \/>\n<meta property=\"og:description\" content=\"AngularJS l\u00e0 m\u1ed9t framework JavaScript m\u00e3 ngu\u1ed3n m\u1edf gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n web b\u1eb1ng c\u00e1ch t\u1ea1o c\u00e1c \u1ee9ng d\u1ee5ng trang t\u01b0\u01a1ng t\u00e1c (SPA). AngularJS\" \/>\n<meta property=\"og:url\" content=\"https:\/\/itviec.com\/blog\/angularjs-la-gi\/\" \/>\n<meta property=\"og:site_name\" content=\"ITviec Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ITviec\" \/>\n<meta property=\"article:published_time\" content=\"2024-10-02T01:57:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1500\" \/>\n\t<meta property=\"og:image:height\" content=\"790\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Uyen Ngo\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ITviec\" \/>\n<meta name=\"twitter:site\" content=\"@ITviec\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Uyen Ngo\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 ph\u00fat\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng - ITviec Blog","description":"AngularJS l\u00e0 m\u1ed9t m\u00e3 ngu\u1ed3n m\u1edf v\u00e0 framework cho c\u00e1c \u1ee9ng d\u1ee5ng web. T\u00ecm hi\u1ec3u chi ti\u1ebft v\u1ec1 c\u00e1ch ho\u1ea1t \u0111\u1ed9ng c\u0169ng nh\u01b0 kh\u00e1i ni\u1ec7m v\u1ec1 AngularJS ngay!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/","og_locale":"vi_VN","og_type":"article","og_title":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng","og_description":"AngularJS l\u00e0 m\u1ed9t framework JavaScript m\u00e3 ngu\u1ed3n m\u1edf gi\u00fap \u0111\u01a1n gi\u1ea3n h\u00f3a qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n web b\u1eb1ng c\u00e1ch t\u1ea1o c\u00e1c \u1ee9ng d\u1ee5ng trang t\u01b0\u01a1ng t\u00e1c (SPA). AngularJS","og_url":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/","og_site_name":"ITviec Blog","article_publisher":"https:\/\/www.facebook.com\/ITviec","article_published_time":"2024-10-02T01:57:30+00:00","og_image":[{"width":1500,"height":790,"url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg","type":"image\/jpeg"}],"author":"Uyen Ngo","twitter_card":"summary_large_image","twitter_creator":"@ITviec","twitter_site":"@ITviec","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Uyen Ngo","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"10 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#article","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/"},"author":{"name":"Uyen Ngo","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/f4cd1226846e0258c664e170d3e52d20"},"headline":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng","datePublished":"2024-10-02T01:57:30+00:00","mainEntityOfPage":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/"},"wordCount":2556,"publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"image":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg","articleSection":["Chuy\u00ean m\u00f4n IT"],"inLanguage":"vi"},{"@type":"WebPage","@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/","url":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/","name":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng - ITviec Blog","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#primaryimage"},"image":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg","datePublished":"2024-10-02T01:57:30+00:00","description":"AngularJS l\u00e0 m\u1ed9t m\u00e3 ngu\u1ed3n m\u1edf v\u00e0 framework cho c\u00e1c \u1ee9ng d\u1ee5ng web. T\u00ecm hi\u1ec3u chi ti\u1ebft v\u1ec1 c\u00e1ch ho\u1ea1t \u0111\u1ed9ng c\u0169ng nh\u01b0 kh\u00e1i ni\u1ec7m v\u1ec1 AngularJS ngay!","breadcrumb":{"@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/itviec.com\/blog\/angularjs-la-gi\/"]}]},{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#primaryimage","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/10\/AngularJS-vippro.jpg","width":1500,"height":790,"caption":"AngularJS - itviec blog"},{"@type":"BreadcrumbList","@id":"https:\/\/itviec.com\/blog\/angularjs-la-gi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Chuy\u00ean m\u00f4n IT","item":"https:\/\/itviec.com\/blog\/chuyen-mon-it\/"},{"@type":"ListItem","position":2,"name":"AngularJS l\u00e0 g\u00ec: \u0110\u1ecbnh ngh\u0129a, C\u00e1ch ho\u1ea1t \u0111\u1ed9ng v\u00e0 T\u00ednh n\u0103ng"}]},{"@type":"WebSite","@id":"https:\/\/itviec.com\/blog\/#website","url":"https:\/\/itviec.com\/blog\/","name":"ITviec Blog","description":"IT Jobs &amp; People in Vietnam","publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/itviec.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"vi"},{"@type":"Organization","@id":"https:\/\/itviec.com\/blog\/#organization","name":"ITviec","url":"https:\/\/itviec.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","width":1800,"height":1800,"caption":"ITviec"},"image":{"@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/ITviec","https:\/\/x.com\/ITviec","https:\/\/www.linkedin.com\/company\/itviec","https:\/\/www.youtube.com\/channel\/UCYthAQ3bcGr57M_ag5gHDvQ"]},{"@type":"Person","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/f4cd1226846e0258c664e170d3e52d20","name":"Uyen Ngo","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","caption":"Uyen Ngo"},"url":"https:\/\/itviec.com\/blog\/author\/uyen-ngo\/"}]}},"_links":{"self":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/79767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/users\/207"}],"replies":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/comments?post=79767"}],"version-history":[{"count":0,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/79767\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media\/79801"}],"wp:attachment":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media?parent=79767"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/categories?post=79767"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/tags?post=79767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}