Angularjs Bootstrap carries the front frame--js control part _angularjs

Source: Internet
Author: User

This simple framework finally only has the JS control part, the angular framework has its own logical part, has its own controller and the service layer, because we may use some angular's built-in resource and the cookie, So we need to add some lib of angular:

--------------index.html------------------

<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 the This case 
It's 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 model, in fact, to the controller layer provides a login method to call, the following 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,< C13/>password: $scope. Login.password 
  }, 
  function (success) { 
  if (Success.status = = "Success") { 
   Alert (' login success '); 
  } else { 
   //error message 
  } 
  }, 
  function (Error) { 
  //error message 
  }; 
 }; 
}]; 

Here it is simple to do some logic, the most important thing is to invoke the service layer provided by the login method.

Some of the other modules can be written according to this pattern, due to the time relationship, many details in this simple framework is not to write, specific if you want to understand the private and I want this framework, I write the basic integrity of the ...

The above is the Angularjs bootstrap to build the front desk JS part of the code, follow-up continue to add relevant information, thank you for your support for this site!

Related articles:

                                 Angularjs Bootstrap carries the front frame--js Control Section
Angularjs Bootstrap with front frame--Basic page
Angularjs Bootstrap equipped with front frame--Preparation
Angularjs Bootstrap detailed and sample code

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.