Category: Angular JS

  • AngularJS Select

    In AngularJS, you can create a dropdown list (select box) based on items in an array, or an object. Using ng-options You should use the ng-option directive to create a dropdown list, based on an object or an array in AngularJS. See this example: Note: about:blank You can also use the ng-repeat directive to make…

  • AngularJS Tables

    The ng-repeat directive is used to draw tables in AngularJS. Displaying tables with AngularJS is very easy and simple. Let’s take an example. This example use ng-repeat directive to draw a table. See this example: Displaying with CSS style You can also style the tables by using CSS. See this example: AngularJS Table example with…

  • AngularJS Filters

    In AngularJS, filters are used to format data. Following is a list of filters used for transforming data. Filter Description Currency It formats a number to a currency format. Date It formats a date to a specified format. Filter It select a subset of items from an array. Json It formats an object to a…

  • AngularJS Dependency Injection

    AngularJS comes with a built-in dependency injection mechanism. It facilitates you to divide your application into multiple different types of components which can be injected into each other as dependencies. Dependency Injection is a software design pattern that specifies how components get holds of their dependencies. In this pattern, components are given their dependencies instead…

  • AngularJS Scopes

    The Scope is an object that is specified as a binding part between the HTML (view) and the JavaScript (controller). It plays a role of joining controller with the views. It is available for both the view and the controller. How to use Scope To make a controller in AngularJS, you have to pass the…

  • AngularJS Module

    In AngularJS, a module defines an application. It is a container for the different parts of your application like controller, services, filters, directives etc. A module is used as a Main() method. Controller always belongs to a module. How to create a module The angular object’s module() method is used to create a module. It…

  • Style elements dynamically with ngStyle

    The ngStyle attribute is used to change or style the multiple properties of Angular. You can change the value, color, and size etc. of the elements. Let’s see this by an example: component.ts file: component.html file: Here, we have chosen a method to show the method randomly “Online” and “Offline”. There is 50% chance. Output:…

  • AngularJS Controllers

    AngularJS controllers are used to control the flow of data of AngularJS application. A controller is defined using ng-controller directive. A controller is a JavaScript object containing attributes/properties and functions. Each controller accepts $scope as a parameter which refers to the application/module that controller is to control. AngularJS Controller Example Note: AngularJS controller example with…

  • AngularJS Directives

    AngularJS facilitates you to extend HTML with new attributes. These attributes are called directives. There is a set of built-in directive in AngularJS which offers functionality to your applications. You can also define your own directives. Directives are special attributes starting with ng- prefix. Following are the most common directives: ng-app directive ng-app directive defines…

  • Angular 7 Components

    Components are the key features of Angular. The whole application is built by using different components. The core idea behind Angular is to build components. They make your complex application into reusable parts which you can reuse very easily. How to create a new component? Open WebStorm>> Go to your project source folder>> Expand the…