Angular JS & SObject Remote : Part 1 Bringing Data to Page #NoControllers

Friday, April 3, 2015


Finally back after long long time!

I have been working with AngularJs for a while now and I find Angular to be really helpful to create stateless interactive pages and best part is you hardly need any Apex Controller for the same. Pages are fast, fluid and Mobile friendly (Salesforce 1).

With time I have found the best ingredient to prepare your AngularJS page are

  • AngularJS ( of course )
  • SObject-Remote (thanks to Jason Venable)
  • Bootstrap (not required)

Lets start with a simple example.

Bringing data to the page


This would be a pretty easy example where we will be using SObject-Remote to bring query data from Salesforce Accounts



The Catch

  • The area ng-controller marks the area which can access the $scope variable of that particular controller.
  • You can access variable inside $scope by using {{}}. If you have a variable $scope.accounts you can directly access that in page by doing {{accounts}}, just like regular merge field but a bit different syntax.
  • We have used $scope.$apply() , which generally tells angular to redraw the UI  / View. Since remoting works async we need to notify the angular to redraw once we have the data by calling this method.

End Result

Finally a stateless fluid page without any controllers.


17 comments:

  1. Welcome back! This is a great example of getting started with Angular and Visualforce. Thanks for all your great posts!

    ReplyDelete
  2. Gr8 work Avi...People with Development/technical background will understand ur efforts..Keep it up and would like to see more articles from you..

    ReplyDelete
  3. Gr8 work Avi...People with Development/technical background will understand ur efforts..Keep it up and would like to see more articles from you..

    ReplyDelete
  4. Hii author nice post! AngularJs is the best framework which is supported by google! I have personally used angularJs for my previous web app developement project and I'am quite satisfied by the output.
    Angulars training | Angularjs training in Chennai | AngularJs training institute in Chennai

    ReplyDelete
  5. Thanks for sharing this helpful article about programming languages,
    AngularJs development companies

    ReplyDelete
  6. Thank You for sharing your article. I like it. We provide TIBCO Online Training in Hyderabad.

    ReplyDelete
  7. This is my first visit to your blog, your post made productive reading, thank you. dot net training in chennai

    ReplyDelete
  8. 9643950605 Croma Campus is one of the best Angularjs Training in Noida with 100% situation ensures. Croma Campus has very much characterized course modules and instructional meetings for understudies and Weekend classes, evening clump classes with live venture by industry master In Noida.

    ReplyDelete
  9. nice post for sharing angularjs article. its really helpful for me.keep shring on updated angularjs tutorials????????????????

    ReplyDelete
  10. Informative article, just what I was looking for.seo services chennai

    ReplyDelete

  11. I Visited lot of blogs and Web sites But in this AngularJS Blog Information is Very usefulthanks for sharing it........

    ReplyDelete
  12. Online mba in India
    DEIEDU is the best online Institute in the world with high class course outline and up to date learning materials. DEIEDU is providing the online mba in india, online mba in india, Distance learning mba courses in india, Correspondence mba in India Mba from distance in India, Online Executive Mba in India, distance Mba from India, Online distance mba in India. Distance learning mba degree in India.
    Address:
    401, fourth floor sg alpha tower
    Vashundhra (up)
    Phone: 9811210788
    Email: info@deiedu.in
    Website: http://www.deiedu.in/
    online mba in india

    ReplyDelete
  13. Hello
    It's very nice blog thanks for sharing info about AngularJS Training
    Just keep on sharing

    ReplyDelete
  14. Excellent in giving the specific example for angularJS using the SObject-Remote Well AngularJS is having one of the best outcome competition in the field comparing to PMP, Actually I was supposed to go for angularJS but I did my PMP Course in Kuwait where I was able to handle certain projects regarding Dotnet or so Many of them are looking for AngularJS course now in the market Anywayz Thank you so much for the Blog

    ReplyDelete
  15. It's very nice blog. I'm so happy to gain some knowledge from here. Thank you for valuable information on
    AngularJS Training in Chennai.
    Hoping to get more info...

    ReplyDelete