In the end, this simple framework only has the control part of js. The angular framework has its own logical part, its own controller and service layer. Since we may use some built-in resource and cookies of angular, we need to add some angular libs:
--------------------------------------------------------------------------------------------------------------------------------
<script src="lib/angular/angular-strap.js"></script> <script src="lib/angular/angular-resource.js"></script> <script src="lib/angular/angular-cookies.js"></script>
First look at our services.js
'use strict'; /* Services */ // Demonstrate how to register services // In this case it is a simple value service. var services = angular.module('jthink.services', ['ngResource']). value('version', '1.0'); services.factory('LoginService', ['$resource', function ($resource) { return $resource('fakeData/userLogin.json', {}, { login: {method: 'GET', params: {}, isArray: false} }); }]);Here we use the factory mode, and in fact, we finally provide a login method to call the controller layer. Let's take a look at this controllers.js
'use strict'; /* Controllers */ var controllers = angular.module('jthink.controllers', []); controllers.controller('LoginCTRL', ['$scope', 'LoginService', function ($scope, LoginService) { $scope.login = {}; $scope.login.submit = function() { console.log($scope.login.email); console.log($scope.login.password); // do some process, invoke the service layer LoginService.login( {}, { email: $scope.login.email, password: $scope.login.password }, function (success) { if (success.status == "success") { alert('login success'); } else { // error message } }, function (error) { // error message } ); }; }]);Here we have to do some simple logic, and the most important thing is to call the login method provided by the service layer.
Some other modules can be written in this pattern. Due to time constraints, many details will not be written in this simple framework. If you want to know about the specific ones, please ask me for this framework in private. I have basically written them in full. . . . .
The above is the code for building the front-end JS part of AngularJS bootstrap. We will continue to add relevant information in the future. Thank you for your support for this site!
Related articles:
AngularJs bootstrap is equipped with the front-end framework - js control part
AngularJs bootstrap is equipped with front-end framework - basic page
AngularJs bootstrap equipped with front-end framework - preparation work
AngularJs bootstrap detailed explanation and sample code