Skip to main content

The AngularJS angle to Visualforce

If someone had mentioned that I would be working on AngularJS a couple of months back, I would have laughed of with that idea. I am a platofrm purist and can work wonders on the platform. Perhaps use jquery for the little magic tricks here and there but thats there. However, as it happened a few weeks back I was introduced to the AngularJS and I cannot be more excited about the technology. A couple of nights in the past I have been deep diving into EggHead to learn AngularJS and have seen in wonder the possibility of Angular $Scope powered with visualforce platform.

After dabbing myself into a bit of Angular, here is first thought on the technology.

The easiest way to implement angular is to include the ng-app on the Apex:page

<apex:page applyhtmltag="false" showheader="false" sidebar="false" standardstylesheets="false">
<html lang="en" ng-app="myApp" ng-controller="AngularController">

There are two major things you need to handle while using Angular:

  1. The template/ CSS/ JS
    • Most Angular template are not single page document and hence you will have to put in a bit of a effort in converting them into Visualforce by using static resources
    • You could also use Apex:composition to create a composition template.
  2. The Apex code/Database handling
    • The best way to work with Angular data is visualforce remoting. You can call Apex methods using Visualforce Remoting and store the values in JSON objects. 
    • Another way to call Apex method is using rest based Api. You can return values and store them in JSON objects for processing.

Where does it go from here? Why use Angular?

There are various scenarios when you will use Angular. If you are keen on building a webpage with mimimum effort. The future expansion of angular code is easy. If you wish to use bootstrap-angular elements like the ever elite DataTables or you are a nerdy person (like me) who does not want simple things out of life.


There some planned updates by Salesforce on Angular front but for now all is safe harbor. Angular is easy to use as visualforce component and you can leard a lot of

Code Samples?

I am still dabbing into the thing for a project and have no time to prepare separate code samples but ill do other post to create samples on Angular. You can however have a look at other community authored pages for code Samples

There are some dreamforce updates related to Angular, if I come across the post will be updated.


Popular Post

The unofficial guide to become a Certified Salesforce Administrator (ADM 201)

In my attempt at maximum certifications in 60 days, I completed Salesforce Certified Administrator exam on February 11th 2013 So you have decided to ramp up your career and take certifications in your hand. Good choice. It is also likely that this is the first time you have heard of Salesforce, certification and since your company has a vision of you completing the certification you have decided to do it. At this stage it is likely that, You have done extensive googling. You have received countless brain-dumps. And you have received plenty of advise from different types of users which ranges from Admin certification is easier than making coffee to Admin certification is tougher than building a rocket-ship to fly off to the moon. The purpose of this guide is to give you a clear understanding of what to expect when you are expected to become Certified Salesforce Administrator. To bring sense to all the things you have seen so far and to clearly explain what to do and what

Some PDF tricks on Visualforce: Landscape, A4, page number and more

The beauty of Visualforce is simplicity. Remember the shock you received when you were told the entire page renders as PDF if you just add renderAs=PDF to the Page tag. For those who thought I spoke alien language right now, here is the trick, to render a page as PDF, we add a simple attribute to the <apex: page> tag <apex: page renderAs='pdf'> This will render the entire page as PDF. Now, say we need to add some extra features to the PDF. Like a page number in the footer or we need to render the page in landscape mode. Faced with this problem, I put on my Indiana Jones hat and went hunting for it in the vast hay-sack of the internet (read: googled extensively). Imagine my happiness when i found a big big page with many big big examples to solve the problem. The document I am referring to is from W3C, paged Box media . Long story short, I now possess the ultimate secret of rendering the page in any format I want. So here are few tricks I learned from the p

The Basics of writing a Apex Trigger

One of the most important and common asked question on Forums and everywhere is how do I write a trigger. Coding in Apex Trigger is like going to a dentist for a root canal, you keep dreading the moment until you realize it is actually not going to hurt you. If you plan to write an Apex Trigger this quick guide will help you doing so. The first and foremost rule in writing a trigger is to remember the oldest suggestion given to the most comprehensive Hitchhikers Guide to Galaxy, ' Don't Panic. ' Writing a trigger is not a rocket science, in-fact we should thank the team at Salesforce and ForceDotCom for making everything so simple, that anyone can do it. Enough of talk, lets code. So you want to write a trigger. Let us have a glimpse of what we are going to build. The problem statement is as follows Problem:  When the User is entering the Opportunity, check for the Opportunity Amount. If the Opportunity Amount is greater than 50,000. Mark the Parent Account as