A Message Box Modal

Message box is widely used in each website. So I created a Message Box Modal using bootstrap and AngularJS for re-usability. I want the user to put such a single HTML to use the message box: <c-msgbox msgbox-show=”showNavMsgbox” msgbox-done=”doneNavMsgbox” msgbox-name=”navMsgbox”></c-msgbox> Here msgbox-show attribute is the name of msgbox showing event, msgbox-done attribute is the name of msgbox returning event, …

Read More

Asynchronous JavaScript – From ECMAScript 5 to ECMAScript 7

I found this interesting article several days ago. It reviews the development of asynchronous JavaScript. The title of the origin is : JavaScript Goes Asynchronous (and It’s Awesome). Reference: https://www.sitepoint.com/javascript-goes-asynchronous-awesome/ By David Catuhe This article is part of a web development series from Microsoft. JavaScript has come a long way since its early versions and thanks to all efforts done …

Read More

Asynchronous JavaScript – JS Timers

Reference:  http://www.cnblogs.com/sprying/archive/2013/05/26/3100639.html, http://ejohn.org/blog/how-javascript-timers-work/, http://www.laruence.com/2009/09/23/1089.html How JavaScript Timers Work In the previous posts we have talked a lot about asynchronous JS. Here in his post I want to have a deeper look into the JS engine, the event loop and find out how JS Timers work. At a fundamental level it’s important to understand the details behind …

Read More

Promises in AngularJS

Reference: https://segmentfault.com/a/1190000002788733 As has mentioned in the previous post, promise is a way that can handle asynchronous tasks.  promise is an object that represents the value or exception that a function may return. Please refer to Asynchronous JavaScript – Promises. Using Promise in AugularJS To use  promise in AngularJS, you need to use the built-in service: $q. We can use defer() method in $q to create …

Read More

Asynchronous JavaScript – Promises

Reference: http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html, http://sporto.github.io/blog/2012/12/09/callbacks-listeners-promises/, https://segmentfault.com/a/1190000002788733 Overview Promises provide a well-defined interface for interacting with an object that represents the result of an action that is performed asynchronously, and may or may not be finished at any given point in time. By utilizing a standard interface, different components can return promises for asynchronous actions and consumers can utilize …

Read More

Asynchronous JavaScript – AJAX

Reference:  https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started, http://www.cnblogs.com/mingmingruyuedlut/archive/2011/10/18/2216553.html AJAX stands for Asynchronous JavaScript and XML. It is the use of the XMLHttpRequest object to communicate with server-side scripts. It can send as well as receive information in a variety of formats, including JSON, XML, HTML, and even text files. AJAX’s most appealing characteristic, however, is its “asynchronous” nature, which means …

Read More

Asynchronous JavaScript – Callbacks & Event Listeners

Reference: http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html, http://sporto.github.io/blog/2012/12/09/callbacks-listeners-promises/, https://www.sitepoint.com/javascript-goes-asynchronous-awesome/ As mentioned in the previous post, there are many tools you can use to deal with asynchronous development in JavaScript. So Here we will discuss Callbacks and Event Listeners. Callbacks Let’s start with callback pattern, this is the most basic and the best known pattern to deal with async programming. A callback looks like this: finder([1, …

Read More

Asynchronous JavaScript – Overview

Reference: http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html As is known to all, the environment of JavaScript runtime is ‘single thread’, which means the JS engine can only handle one task at one time. If there exists several tasks, the tasks should wait in a queue. Only the former task has finished, the latter one can be executed. The tasks are executed one …

Read More

Sharing Data Between Controllers in AngularJS

Reference: http://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers Sharing data between controllers is quite common when using AngularJS. There are many ways that can make it: Scope inheritance Using services Using event Scope inheritance Scope inheritance has been mentioned in Passing Data Between Parent/Child Scopes in AngularJS. You can only share data between parent and child controllers by this way. Here is a simple example: In Html: …

Read More

Understanding Scopes in AngularJS

Reference: https://github.com/angular/angular.js/wiki/Understanding-Scopes In AngularJS, a child scope normally prototypically inherits from its parent scope. One exception to this rule is a directive that uses scope: { … } — this creates an “isolate” scope that does not prototypically inherit.(and directive with transclusion) This construct is often used when creating a “reusable component” directive.  Scope inheritance is normally …

Read More