Skip to main content

Posts

Showing posts from January, 2015

AngularJS using ng-switch Directive

What is ng-Switch               The ng-Switch directive will used for condition swap the DOM elements. This directive is support the scope of angular variable, The DOM is enable means when the matched ng-switch-when properties is equal. This properties compare into String only.              ng-switch-when case more than matched DOM value also return. It will like unique and duplicated both will return from the ng-switch directive. HTML : <div ng-app="switchApp">     <div ng-controller="SwitchCtrl">         <div ng-switch= "grade">             <div ng-switch-when="A">You got A Grade</div>                         <div ng-switch-when="B">You got B Grade</div>             <div ng-switch-when="C">You got C Grade</div>             <div ng-switch-when="D">You got D Grade</div>             <div ng-switch-when="E">Yo

Angular Function Components

AngularJS Function Components :              We focus ng function components. It will support to do a set of basic task to done. This component to manipulate into all set of function to all angular components. Like will do a list of functions angular.lowercase - This function will converted string into lowercase. angular.uppercase - This function will converted string into uppercase. angular.isNumber - Determinate whether a number variable into find. angular.isString - Determinate whether a string variable into find. angular.isArray - Determinate whether a array variable into find. angular.isObject - Determinate whether a Object variable into find. The above List have some basic will refer more into  angularjs. HTML Code: <div ng-app="isApp">     <div ng-controller="isCtrl">         Cos value is {{cos}} <br>         {{firstString}} <br>         Sin value is {{sin}}<br>         {{secondString}}     </div

ng-Class using angularjs Example

ng-Class in angularJS         ng-Class directive to manage a css properties from the DOM Objects. This directive very support to user presentation css apply dynamically and more response, angularjs used for bootstrap css only. Write different properties from the css file and enable from the controller scope object values. HTML:    <div ng-app="classApp">     <div ng-controller="ClassCtrl">        <span ng-if="showValue">         <p ng-class ="{'red': show, 'green': show1}">{{name}}         </p>         </span>          <span ng-if="!showValue">         <p ng-class ="{'red': show, 'green': show1}">{{name}}         </p>         </span>     </div> </div> Angular Script: var app = angular.module('classApp',[]); app.controller('ClassCtrl',function($scope){     $scope.na