What is APP_BASE_HREF in Angular 10 ?

What is NgClass in Angular 10 ?

Last Updated : 30 Apr, 2021

In this article, we are going to see what is NgClass in Angular 10 and how to use it.

NgClass is used to Add or remove CSS classes on an HTML element

Syntax:

<element [ngClass] = "typescript_property">

Approach:

Create the angular app to be used
In app.component.html make an element and sets its class using ngclass directive
serve the angular app using ng serve to see the output

Example 1:

app.component.ts

import { Component, OnInit } from '@angular/core'; 
  
@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html'
}) 
export class AppComponent { 
  
  }

app.component.html

<div [ngClass] ="'gfgclass'"> 
  GeeksforGeeks 
</div>

Output:

What is APP_BASE_HREF in Angular 10 ?

taran910

Improve

Article Tags :

Similar Reads

What is NgStyle in Angular 10 ?

In this article, we are going to see what is NgStyle in Angular 10 and how to use it. NgStyle is used to add some style to an HTML element Syntax: <element [ngStyle] = "typescript_property"> Approach:Â Create the Angular app to be usedIn app.component.html make an element and sets its class us

Class Binding in Angular 8

Class binding in Angular makes it very easy to set the class property of a view element. We can set or remove the CSS class names from an element's class attribute with the help of class binding. We bind a class of a DOM element to a field that is a defined property in our Typescript Code. Its synta

What is Angular ?

Angular is an open-source web application framework maintained by Google and a community of developers. It is designed to build dynamic and interactive single-page applications (SPAs) efficiently. With Angular, developers can create robust, scalable, and maintainable web applications. Table of Conte

What is CommonModule in Angular 10 ?

In this article, we are going to see what is CommonModule in Angular 10 and how to use it. CommonModule is used to export all the basic Angular directives and pipes. It is re-exported when we import BrowserModule into our angular application, BrowserModule is automatically imported into our applicat

What is APP_BASE_HREF in Angular 10 ?

In this article, we are going to see what is APP_BASE_HREF in Angular 10 and how to use it. APP_BASE_HREF returns a predefined DI token for the base href of the current page. The APP_BASE_HREF is the URL prefix that should be preserved. Syntax: Â provide: APP_BASE_HREF, useValue: '/gfgapp' Approach:

What is Angular Expression ?

Angular is a great, reusable UI (User Interface) library for developers that help in building attractive, and steady web pages and web application. In this article, we will learn about Angular expression. Table of Content Angular ExpressionDifferent Use Cases of Angular ExpressionsSyntaxApproachÂ Ang

Angular PrimeNG StyleClass Target

Angular PrimeNG is an open-source framework for Angular applications. It has a rich set of native UI components that can be used to make attractive and scalable web interfaces. In this article, we will discuss Angular PrimeNG StyleClass Properties. StyleClass is used to manage CSS classes during ent

What is Angular Material?

User Experience is one of the most important things in web development. Angular Material emerges as a powerful tool for developers, offering numerous UI components designed to elevate your Angular applications to new heights of elegance and functionality. In this article, we'll learn more about Angu

Angular Conditional Class with *ngClass

In this article, we will see the basic implementation of the Conditional class with *ngClass in Angular, along with understanding their implementation with the help of examples. Conditional class with *ngClassAngular's *ngClass directive allows us to apply CSS classes conditionally to an element. It

What are templates in AngularJS ?

Templates in AngularJS are simply HTML files filled or enriched with AngularJS stuff like attributes and directives. A directive is a marker element that is used to target a particular attribute or class to render its behavior according to the needs. Model and controller in Angular are combined with