Directives in Ionic ppd.pdf
Document Details
Uploaded by Deleted User
Tags
Full Transcript
Directives in Ionic Structural Directive Ngif Ngfor NgSwitch Attribute Directive ngClass NgStyle NgIf When we want to display something based on some condition that time we used ngIf. For example : If I want to display image on button click that time I can use ngIf ngif ngFor The *ngFor dir...
Directives in Ionic Structural Directive Ngif Ngfor NgSwitch Attribute Directive ngClass NgStyle NgIf When we want to display something based on some condition that time we used ngIf. For example : If I want to display image on button click that time I can use ngIf ngif ngFor The *ngFor directive in Angular is used to loop over a collection of items, such as an array or a list, and generate HTML elements for each item in the collection. It's similar to a "for-each" loop in other programming languages. ngFor ngSwitch The ngSwitch directive in Angular allows you to conditionally display elements based on the value of an expression. It's similar to a switch-case statement in programming. You use it when you have multiple conditions to evaluate and want to display different templates based on each condition. ngSwitch This is similar to switch statement in Programming language. output ngClass ngClass dynamically adds or removes one or more CSS classes from an element. You can use it to conditionally apply classes based on a specific condition. The key is the class name, and the value is a Boolean condition. If the condition evaluates to true, the class is applied. ngClass CSS Code output ngStyle ngStyle dynamically sets inline styles to an element. It works similarly to ngClass, but instead of applying CSS classes, it directly applies styles. IN TS file