Angular-Cheatsheet

๐Ÿ‘‹ Hello Angular // app.component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-root', template: '<h1>Hello Angular!</h1>', }) export class AppComponent { } ๐Ÿ’ก Tip: Use the Angular CLI to generate a new project — ng new my-app . ๐Ÿงฉ Components // hero.component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-hero', templateUrl: './hero.component.html', styleUrls: ['./hero.component.css'] }) export class HeroComponent { name = 'Iron Man'; } ๐Ÿ’ก Tip: Components = template + logic + style. Create with ng generate component hero . ๐Ÿ”— Data Binding <!-- hero.component.html --> <h2>{{ name }}</h2> <!-- Interpolation --> <button (click)="sayHello()">Click</button> <input [(ngModel)]="name" /> <!-- Two-way binding --> ๐Ÿ’ก Tip: Use [(ngModel)] for two-way binding. Import FormsModule in your module…

Post a Comment