Posts in category Ionic 2

Global Events and Event Delegation in Angular 2

angular 2 thumbnail global event

In Angular 2, we are used to listening for events on the Component’s DOM elements, however how do we listen to events outside of this range? Two ways to do this: Creating a Host Listener Using the Component’s host property

Angular 2 Transclusion with ng-content in one go

angular 2 projector thumbnail ng-content

Transclusion was one of the coolest feature of Angular 1. Angular 2 made this (way) more simple and also changed its name to Projection. What we used to configure in our directives with some symbols and ngTransclude is now directly handled into the DOM. Before diving into it, let’s refresh our memory. Here is the most basic Projection example:   We pass some […]

Introduction to Angular 2 Animations

angular 2 animation thumbnail.png

When it comes to Web Development, Animations can make or break your UX. Too much of them and your website looks like a Vegas Casino. None and your website will be missing the little spark to make it stand out. Angular has made some great improvement in this domain since version 1.3 so let’s see what Angular 2 offers!

Angular 2 Reactive Forms Validations

Angular 2 rxjs form validation

Following the tuts on Reactive Forms and  Observables, today we tackle the validation part! This part is very important, it’s your last protection before the data are sent to your server so be careful here.

Angular 2 Template-Driven Forms in One Go

Angular 2 forms

After a long break, let’s get back into the flow with a simple tuts. No server-rendering-worker-asynchronous-resolution-injection here, just something that everybody use: forms! Today we take a look at how template-driven forms work in Angular 2. A 5-minutes read to slowly get back in form.

E2E Testing In Angular 2 From Zero To Hero (part 1)

e2e testing protractor

Learning how to test your Angular 2 or JavaScript applications is essential to become a great developer. This skill can dramatically boost or decrease your productivity (hence your happiness and salary).

Using 3rd Party CSS With WebPack and Angular 2 ft Animate...

animate css angular 2 webpack

Sometimes learning something can be complicated moreover when we need to handle many things at the same time. So if your boss tells you that you need to add some CSS from a third-party library into your Angular 2 components AND handle the WebPack configuration, you can feel like overwhelmed

ng2-drag-drop-tree: Everything about CSS and ngClass

angular 2 drag drop tree

Hi folks! At the beginning I wanted to split adding default classes and configurable classes in two posts. Well **** it, let’s do both at the same time!

ng2-drag-drop-tree: Adding a new node and demo available!

angular 2 drag drop tree

One very important feature wasn’t listed yet, the possibility to add some nodes! Let’s do this! First we will add a very beautiful icon in the tree-node.html: In tree-node.component we create the function addNewNode. Very simple, using the spread operator we recreate the subNodes of the node that we passed and push at the end a new node that is created using […]

The Only Ionic Material Tuts You Will Need

ionic material thumbnail

Basically Ionic Material provides better configurations for icons, CSS classes, new components and animations that are not natively available in the Ionic Framework.