Angular custom directives can take inputs using @HostBinding and add event listeners to elements using @HostListener. In this tutorial, we will create a custom directive example from scratch which will take user inputs from a directive element and use them in event listeners. Let’s create a new Directive in the Angular application to demonstrate an
Category: Angular
Angular 8|9 Swiper Slider Effects ‘fade’ | ‘cube’ | ‘coverflow’ | ‘flip’ Tutorial
Swiper slides animation tutorial using the ngx-useful-swiper package in Angular 7+ applications. In the previous tutorial, we discussed How to add a Swiper slider in an Angular application using the ngx-useful-swiper package with various Configurations, Even handling and Method trigger to control slider navigation. Swiper Slider provides some of the best and cool animation effect
Angular 8|9 Swiper Slider ngx-useful-swiper Examples
The Swiper Slider implementation tutorial using the ngx-useful-swiper package in the latest Angular version 9. Image or HTML content sliders add are used for many purposes for users to display a number of items in a limited space like Amazone show items to buy and some websites or application displays offer sliders on the home
Resolve! TypeError: You provided ‘undefined’ where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
In one of my Angular 8 project, there was an API call of type GET, but strangely I was not able to make any call to server and error callback displaying this error:
Angular 8/9 Set Title Dynamically on Route Change
The traditional website has pages that are loaded while refreshing the whole website or sometimes rerendered using dynamic languages like PHP from the server-side. Such websites can have title tags on each page which can be dynamic or manually placed on static HTML pages. Single page application (SPA) like Angular where only one page i.e
Ionic 4/5 Camera Preview | Floating Camera View In Page | Tutorial
Ionic’s Camera Preview Native plugin provides an awesome floating Camera view in application pages itself without even opening the Camera application. The Camera Preview plugin provides native features of a camera that can be easily controlled using built-in class methods. Switch FRONT / BACK camera Turn On/Off/Auto flash Camera Effects; none | aqua | blackboard
Ionic 4/5 Angular Google Maps with Places Search using @agm
In this tutorial, we will learn how to add Google Maps in an Ionic application using a powerful package @agm. The @agm package provides directive components to easily add Maps, Markers and Geometric shapes like Radius on Google Maps in Angular applications. Here we will use the power of this great package to implement Google
Ionic 5 Geolocation Native Plugin Tutorial
Ionic Geolocation Native Plugin Example Tutorial Compatible with Ionic 4 & 5 Angular Using Ionic’s Geolocation native plugin we can get current coordinates and other information like accuracy, speed, timestamp, altitude etc.
Ionic 4/5 Simple Filter Search Pipe for Lists using ng2-search-filter
A search-filter to any data list or table adds up more value to the usability of the page. In this article, we will learn how to quickly add a search filter on any type of data which can be a list or table using a special filter package ng2-search-filter for Angular projects.
Ionic 4/5 Action Sheet | Angular Tutorial
In this tutorial, we will implement the Action Sheet menu in the Ionic 5 application. The action sheet menu is open by sliding up from the bottom of the view. Action sheet menu is added to provide some action controls to the user which pops up and gets visible which takes no space on view
