Thursday 30 May 2013

What is AngularJs

AngularJS is a js framework developed by google. AngularJS is  100% JavaScript, 100% client side and compatible with both desktop and mobile browsers.

Angular can use jquery if it's present in your app. If jQuery is not present in your script path, Angular falls back to its own implementation of the subset of jQuery that we call jQlite.

jQlite is a tiny, API-compatible subset of jQuery that allows Angular to manipulate the DOM. jqLite implements only the most commonly needed functionality within a very small footprint, so only a subset of the jQuery API - methods, arguments and invocation styles - are supported.

AngularJs and jquery embedded  Example:

 
function Controller($scope) {
                $scope.master= {};
                 $scope.friends = [{name: "test"},{name: "aest"},{name: "sest"},{name: "dest"}];
                $scope.update = function(user) {
                    $scope.master= angular.copy(user);
                };
                    $scope.addTodo = function() {
                  
                    if($('#numberId').val()==''){                     // Jquery Syntax and methods

                        $('#numberId').removeClass("ng-pristine ng-valid ng-valid-number ng-valid-max ng-valid-min");
                        $('#numberId').addClass("ng-valid-max ng-valid-min ng-dirty ng-invalid ng-invalid-number");
                    }else{
                        $('#frm1').submit();
                    }


             
   };

                $scope.reset = function() {
                    $scope.user = angular.copy($scope.master);
                };

                $scope.reset();
            }

Angular's jQuery lite provides the following methods:
Angular Js Vs jquery:

i) AngularJS is a  framework . JQuery is not a framework but a library.
ii) If you are looking to build a single page app especially a CRUD app then AngularJS is a good fit. Single page apps can be done using query as alone but you will have to manage the framework side of things yourself.

FAQ:

http://docs.angularjs.org/misc/faq

AngularJs Cheat Sheet


http://www.cheatography.com/proloser/cheat-sheets/angularjs/

1 comment: