Search by category:
AngularJS

Modules trong AngularJS, AngularJS Modules là gì?

Modules trong AngularJS, tìm hiểu AngularJS Modules xem chúng gồm những mô đun nào và có tác dụng gì trong AngularJS. Với framework thì module là không thể thiếu và trong AngularJS cũng vậy.

AngularJS Modules là gì?

AngularJS Modules là khái niệm dùng để định nghĩa một ứng dụng AngularJS, một Modules là một gói chứa các thành phần khác nhau trong ứng dụng AngularJS cũng như chứa các bộ điều khiển ứng dụng AngularJS.

Cách tạo một Module trong AngularJS

Một module được tạo ra bằng cách sử dụng AngularJS function angular.module.

Ví dụ:

<div ng-app="myApp">...</div>

<script>

var app = angular.module("myApp", []); 

</script>

Trong đó: myApp là tên ứng dụng sẽ điều khiển thành phần trong thẻ div đó.

Và bây giờ bạn có thể thêm controllers, directives, filters…, to your AngularJS application.

  • Để thêm một controller bạn sử dụng Module controllers
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
{{ firstName + " " + lastName }}
</div>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
});
</script>
</body>
</html>
  • Để thêm một Directive bạn sử dụng Module directive
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="myApp" w3-test-directive></div>
<script>
var app = angular.module("myApp", []);
app.directive("w3TestDirective", function() {
    return {
        template : "I was made in a directive constructor!"
    };
});
</script>
</body>
</html>

Như vậy là bạn đã tìm hiểu về Modules trong AngularJS, hẹn gặp lại ở bài tiếp theo nhé.

Post Comment

Loading...
loading...
loading...