Skip to main content

AngularJS - Using broadcast or shared service to communicate controllers' data

Either using broadcast approach or shared service is enough to solve the problem about communicating data between two controllers. Using broadcast can update immediately the child controller data when performing an event on parent.

Code example on Codepen :
http://codepen.io/vnnvanhuong/pen/ojXJRw?editors=101

Comments

Popular posts from this blog

What the heck is Meteor DDP?

I was using Meteor for my messenger project. I was so curious about the real time connection. I wanted to know how exactly this mechanism works. In this post, I will go through the DDP Specification, an overview of WebSocket, and a simple demo about how to subscribe a publication of Rocket.Chat (containing a DDP server) from an external webpage. At a glance, I knew that Meteor invented a protocol called DDP which uses for handling real time connection. So then, what is DDP? "DDP (Distributed Data Protocol) is the stateful WebSocket protocol that Meteor uses to communicate between the client and the server." [1] All right! Why does DDP matter? "DDP is a standard way to solve the biggest problem facing client-side JavaScript developers: querying a server-side database, sending the results down to the client, and then pushing changes to the client whenever anything changes in the database" . [2] In order to understand deeply the protocol, I decided ...

Strategy Design Pattern

For example, I have a program with an Animal abstract class and two sub-classes Dog and Bird. I want to add new behavior for the class Animal, this is "fly".  Now, I face two approaches to solve this issue: 1. Adding an abstract method "fly" into the class Animal. Then, I force the sub-classes should be implemented this method, something like: public abstract class Animal{ //bla bla public abstract void fly(); } public class Bird extends Animal{ //bla bla public void fly(){ System.out.println("Fly high"); } } public class Dog extends Animal{ //bla bla public void fly(){ System.out.println("Cant fly"); } } 2. Creating an interface with method "fly" inside. The same issue to an abstract class, I force the classes these implement this interface should have a method "fly" inside: public interface Flyable{ public void fly(); } public class Bird implements Flyable{ //bla bla public void fly(){ System.out.pr...

Journal: This Month I Learned (2022-Nov)

This Month I Learned posts are aimed to share what I have learned during the month such as my thoughts, recommend resources, tips, how-to, and so on. Vung Tau beach Engineering Levels I conducted a lot of meetings with HRM to define the standards for evaluation criteria, career path ladder, Personal Appraisal (PA) processes, and onboarding/offboarding processes. I knew more about the expectation from an HRM perspective for engineering levels evaluation criteria. For example Define many enough titles for a long career path development Define general criteria for each level How to calculate score when evaluation with weight matrix applied Anticipate risks before executing a process Team Engineering Lead Organization I collected ideas from different people When having no dedicated leader, every member of the team has a fairly chance to practice leadership skills Scalability strategy: development teams’ size, and new position nomination. Security Awareness Training I conducted this sharing...

Only allow input number value with autoNumeric.js

autoNumeric is a jQuery plugin that automatically formats currency and numbers as you type on form inputs. I used autoNumeric 1.9.21 for demo code. 1. Dowload autoNumeric.js file from  https://github.com/BobKnothe/autoNumeric 2. Import to project <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="js/autoNumeric.js"></script> 3. Define a function to use it <script type="text/javascript"> /* only number is accepted */ function txtNumberOnly_Mask() { var inputOrgNumber = $("#numberTxt"); inputOrgNumber.each(function() { $(this).autoNumeric({ aSep : '', aDec: '.', vMin : '0.00' }); }); } </script> 4. Call the function by event <form> <input type="text" value="" id="numberTxt"/>(only number) </form> <script ty...

Merging source in SVN

My team has used Primefaces for our projects. We sometimes have several branches of the projects with a new Primefaces's release. For example, we currently have a project with two branches, a branch for using Primeface 4.0, a trunk for using Primeface 5.0, and we are working these parallel branches. Our project looks like the following: - myProject - branches + primefaces4 + tag + trunk (primefaces5) My problem is how to copy the same source from the trunk to the branch "primefaces4". That is where SVN Merging can help! Here is the steps those I have conducted in my project. Step 1 : open the project with the branch "primefaces4" Step 2 : Team > Merge... Chose the trunk's URL. For example: http://192.168.9.10/svn/myProject/trunk Step 3 : Select the revision from "trunk" to merge. For example: +--revision--+--date--------+--author----+--comment---+ +  10        + 03.10.2014 + vanhuong   + f1: part 3 + +  9     ...