Developer Tools Stuff


I was browsing an application which have a page where few fields are available to alter user account like assigning permissions to user for accessing other resources of application then click Save Button.

Now this Save Button is user role specific which is enabled to super user only and disabled by default is done by CSS class.

When you need this control and does not have role of super user can be accessible with browser developer tools.

Browser Developer tools can be enabled by pressing F12 key from key board, then navigate to DOM Explorer and search for Save button id and remove disabled property along with change name of css class to any random name as shown below:


Thats all for the day.




Angular Ng-Click Directive


Today we explore ng-click directive of Angular JS.

Before we proceed with lets, design a page with technology names and their likes and dislikes as shown below.


This can be achieved from the below markup.


Now build the model which has data and functions which increases count of Likes and dislikes of technologies as shown below.


That’s all for the day.

Angular NG-Repeat


Today we discuss short about angular ng-repeat directive. Below is my page which would like to display data in tabular format which can be achieved by using markup table attributes with thead,tbody etc. with angular ng-app, ng-repeat directives.


Now look at ngrepeat.js is the script file which has module,controller and is responsible for population of data on html page. Now script file looks as  below:


The output of the following lines of code could be as below:


As you can see there is no borders and lines defined in above tabular format which can be achieved by using style sheets and could be illustrated in later posts.

Thats all for the day.

Happy coding..:)



My Angular 1

My first Angular Program which includes :

Basic directive for angularjs to execute is ng-app.  Angularjs looks for ng-app directive and then proceed with execution else will not pickup the code and expression does not gets evaluated  that is handled by browser considering as plain text.

In Angular {{———–}} is referred as expression.

Angular is not responsible in div which is outside scope of ng-app.

If angular ng-app is appended in body then this is applicable to the entire  body of page.


Consider the same above program where there are two divs elements and first bind with Angular and other is independent whose expression value is not evaluated and displays the same.


The output of the above program is shown below:


Now when ng-app directive is used in body element of page then all divs are effective under ng-app directive.

Now lets look on arrays in angular.


The output of this program is as follows:


in the last div we specified 1==2 expression for which Angular is returning false.

Thats it for the day