In this tutorial, we will add Tabs navigation in the Ionic 5 Angular application. By tapping on these tabs bar a user can navigate through different application pages by which can be switched using the Angular Routing mechanism. Tabs based navigation provides quick access to major sections of an application like search product, cart, settings,
Github is used to track code changes and manage issues for an application. It helps to maintain a history of code changes by multiple team members and contributors. Using git versioning we can travel back in time to fetch the old version of code.
In the @ng-select filter, we have a requirement to show only those results which have all of the words( or only a part of it ) typed in the search field. These term keywords can be separated by a space.
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
In this tutorial, we will learn How to use HTTP and HTTPS core libraries of NodeJs to make a remote call to a server. NodeJs provides a number of Core libraries or features that we can use during NodeJs development. One of those is HTTP and HTTPS, both are the same in terms of usage
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
The Swiper Slider implementation tutorial using the ngx-useful-swiper package in the latest Angular version 9/8. Swiper Slider Carousel is actually more than an Image Slider, we can have any type of content from HTML, graphics, video etc. Swiper also supports parallax effect multiple slide effects, having verticle and horizontal sliders. It also supports nested
In this article, we will learn How to create an Ionic 5 application using React and also go through the structure and get to know How actually a React application works? In starting or before Ionic’s version 4, Angular was the only choice available to build an Ionic application. But now Ionic provides multiple platforms
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:
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
The ion-segment UI components display buttons in a group of a horizontal row. These button groups are switched on tap with a beautiful sliding effect in Android as well as IOS
In this Ionic 5/4 tutorial, we are going to discuss how to add a floating camera window/ preview which can be switched for front or rear camera with multiple camera filters in Ionic Angular application using Cordova and Native Plugins. Ionic’s Camera Preview Native plugin provides an awesome floating Camera view on the component in
The geofence is an area defined in a geometrical shape which can be a circle or any polygon shape around a coordinate on a Geological map. In google maps, a Geofence is used to know if the current device has entered or exited from a geofence. Indication about leaving or exiting a Geofence can be
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
During installation and adding the Android platform to your Ionic application you may face the following issue in your terminal window:
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.
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.
In this Ionic 5/4 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
In this Ionic 5/4 tutorial, we’ll add the Tabs component in the Ionic Angular application page without Routing. We’ll be using the Ngx-Bootstrap package to integrate Bootstrap in the Angular project. We have already discussed how to add Tabs in an application using Ionic Framework using the UI component. But these Tabs have their own