Category: Angular JS

The scope is the binding part between the HTML (view) and the JavaScript (controller). A scope is an object with available properties and methods. The scope is available for both View and Controller. When you create a controller in AngularJS, you pass the $scope object as an argument: Example Properties made in the controller can be referenced in the…

@angular/cdk/drag-drop module provides you a way to easily and declaratively build drag-and-drop interfaces, with support for free dragging, sorting within lists, lists, animations, touch devices, Moving items between custom drag handles, previews, and placeholders in addition to horizontal lists and locking along the axis. Start by importing the DragDropModule into the ngmodule where you want to use the drag-and-drop features.…

<mat-card> is a content container for text, photos, and actions in the context of a single subject. Basic cards The most basic cards require only a <mat-card> element with some content. However, Angular Material provides several preset sections that you can use inside <mat-card> : Element Description <mat-card-title> Card title <mat-card-subtitle> Card subtitle <mat-card-content> Primary card content.…

In Angular, template is a part of HTML. Use special syntax within templates to create many of Angular’s features. Each Angular template in your application is a chunk of HTML to be included as part of the page displayed by the browser. An Angular HTML template renders a view, or user interface, in the browser…

API stands for Application Programming Interface. AngularJS Global API Global API functions are accessed using Angular objects. API description angular.lowercase() Converts a string to lowercase angular.uppercase() Converts a string to uppercase Angular.isString() Returns true if the reference is a string angular.lowercase() Example: angular.uppercase() Example Angular.isString() Example angular.isnumber() Example AngularJS Module ng (core module) This module is provided…

Prerequisite Create angular application Let’s start with creating our Angular project. First, we need to install the latest version of Angular CLI by running the following command. After running the above command, you can verify the latest CLI version by running the ng version. It will show the version as below: Now, let’s create a…

A typical Angular application executes in the browser, rendering pages in the DOM in response to user actions. Angular Universal executes on the server, generating the static application page which is then bootstrapped on the client. This means that the application typically renders more quickly, giving users a chance to see the application layout before…

Redux is a reactive state management library which is developed by Facebook and used in the React library. It is based on the Flux pattern. The difference between Flux and Redux is how they handle tasks; In the case of Flux, we have multiple stores and one dispatcher, whereas, in Redux, there is only one Store,…

Lazy loading is a technology of angular that allows you to load JavaScript components when a specific route is activated. It improves application load time speed by splitting the application into many bundles. When the user navigates by the app, bundles are loaded as needed. Lazy loading helps to keep the bundle size small, which…

Testing the Angular application helps us to that your app is working or not as you expected. The test documentation provides some techniques for unit and integration testing Angular applications by a sample application created by Angular CLI. Prerequisites If You have a basic understanding of the below concepts before writing test cases for the Angular App, it…