Skip to content

Instantly share code, notes, and snippets.

View debugmodedotnet's full-sized avatar

Dhananjay Kumar debugmodedotnet

View GitHub Profile
// There are four types of databibding in Angular
// Interpolation - one way data binding - data flows from component to view ={{data}} Display data
// Property Binding - one way data binding - data flows from component to view = [property]="data" Set element property value
// event binding - one way data binding - data flows from view to component = (event)="expression" Respond to user events
// two way data binding - two way data binding - data flows from component to view and view to component = [(ngModel)]="data" Respond to user events and update properties
import { Component, HostListener, OnInit, ViewContainerRef } from '@angular/core';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
count = 0;
import { Injectable } from '@angular/core';
import { RootInjectorGuard } from './root-injector.guard';
@Injectable({
providedIn: 'root'
})
export class AppService extends RootInjectorGuard {
constructor() {
super(AppService)
import { inject, InjectOptions, Type } from "@angular/core";
export class RootInjectorGuard {
option: InjectOptions = {
skipSelf: true,
optional: true
};
constructor(type: Type<any>) {
console.log(type.name);
const parent = inject(type, this.option);
@Component({
selector: 'app-fipq',
templateUrl: './fipq.component.html',
styleUrls: ['./fipq.component.css'],
providers: [AppService]
})
export class ProductComponent implements OnInit {
constructor(private appservice: AppService) { }
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class AppService {
constructor() { }
}
import { NgModule } from '@angular/core';
import { A11yModule } from '@angular/cdk/a11y';
import { ClipboardModule } from '@angular/cdk/clipboard';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { PortalModule } from '@angular/cdk/portal';
import { CdkStepperModule } from '@angular/cdk/stepper';
import { CdkTableModule } from '@angular/cdk/table';
import { CdkTreeModule } from '@angular/cdk/tree';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatBadgeModule } from '@angular/material/badge';
const products : IProductDetails[] = [
{
product:{
Id: 1,
Title: 'Pen',
Price: 100
},
inStock:true,
Qyanity: 100,
Color: "Red",
function Product(title,price){
this.title = title;
this.price = price;
console.log(this);
}
// call a function as method - MIP
// value of this inside function - always object before dot
let c1 = data.findIndex( t => Object.keys(t)[0] == d.type);
if(c1 > -1){
if(data[c1][d.type].length >1){
const index = data[c1][d.type].indexOf(d.title);
if (index > -1) {
data[c1][d.type].splice(index, 1);
}
}
else{
const index = data[c1][d.type].indexOf(d.title);