http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com Thành phần Controller AngularJS Một ứng dụng AngularJS hoạt động dựa vào phần controller để điều khiển luồng liệu ứng dụng Một controller định nghĩa sử dụng directive ng-controller Một controller đối tượng JavaScript bao gồm thuộc tính hàm Mỗi controller chấp nhận $scope tham số để hướng đến ứng dụng/module mà phần controller điều khiển Ở phần thông báo studentController sử dụng ng-controller directive Những bước tiếp theo, định nghĩa studentController sau: function studentController($scope) { $scope.student = { firstName: "Mahesh", lastName: "Parashar", fullName: function() { var studentObject; studentObject = $scope.student; return studentObject.firstName + " " + studentObject.lastName; } }; } studentController nghĩa đối tượng JavaScript với $scope tham số $scope hướng đến ứng dụng sử dụng đối tượng studentController $scope.student thuộc tính đối tượng studentController firstName lastName hai thuộc tính đối tượng $scope.student Chúng ta khởi tạo giá trị cho chúng (firstName:Mahesh, lastName:Parashar) http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com fullName hàm đối tượng $scope.student có nhiệm vụ trả giá trị tên đầy đủ student Trong hàm fullname nhận đối tượng student sau trả lại tên so khớp Chú ý, định nghĩa đối tượng controller tệp JS riêng rẽ khai báo trang HTML Bây sử dụng thuộc tính studentController với ng-model expression sau: Enter first name: Enter last name: You are entering: {{student.fullName()}} Chúng ta bind giá trị student.firstName student.lastName vào hộp input Chúng ta bind giá trị student.fullName() tới trang HTML Bây giờ, nhập giá trị firstName hay lastName vào hộp input, tên đầy đủ sinh viên tự động cập nhật Ví dụ Dưới ví dụ cho phần giải thích controller bên trên: testAngularJS.jsp Angular JS Controller AngularJS Sample Application Enter first name: Enter last name: http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp Copyright © vietjack.com You are entering: {{student.fullName()}} var mainApp = angular.module("mainApp", []); mainApp.controller('studentController', function($scope) { $scope.student = { firstName: "Mahesh", lastName: "Parashar", fullName: function() { var studentObject; studentObject = $scope.student; return studentObject.firstName + " " + studentObject.lastName; } }; }); Kết Mở trang textAngularJS.jsp trình duyệt web Và xem kết http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/angularjs/index.jsp http://vietjack.com/ Trang chia sẻ học online miễn phí Copyright © vietjack.com Page ... dụ Dưới ví dụ cho phần giải thích controller bên trên: testAngularJS.jsp Angular JS Controller< /title> ... textAngularJS.jsp trình duyệt web Và xem kết http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com /angularjs/ index.jsp http://vietjack.com/ Trang chia sẻ học online miễn. .. ng-model="student.lastName"> http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com /angularjs/ index.jsp Copyright © vietjack.com You are entering: {{student.fullName()}}