Virtucham tech's

Пікірлер

@virutchamtechs9700 20 күн бұрын

import { createReducer,on } from "@ngrx/store"; import { cart } from "./cart.model"; import { loadData,addCart,updateCart,deletCart } from "./action"; import { error } from "console"; import { InitialState } from "@ngrx/store/src/models"; import { Action } from "rxjs/internal/scheduler/Action"; export interface cartsState { carts:cart[]; error:string; } export const initalState:cartsState = { carts:[], error:'' } export const cartReducer = createReducer( initalState, on(addCart,(state,{cartItems})=> ({...state,carts:[...state.carts,cartItems]})), on(updateCart,(state,{cartItem})=>({...state,carts:state.carts.map((x)=>x.id === cartItem.id?cartItem:x)})), on(deletCart,(state,{id})=>({...state,carts:state.carts.filter(y=>y.id !== id)})) ) or function method without using on optional you can try but above one is latest method using on without on method export function cartReducer(state = this.InitialState,action:any):cartsState{ switch(action.type){ // state is remain same only new state will be create so only using spread method Here case addCart.type: return{...state,carts:[...state.cart,action.cart]} } export const cartReducer = createReducer( initalState, on(addCart, (state,{cartItems}) => ({ ...state, carts:[...state.carts,cartItems] })), );

@isatiuak3827 22 күн бұрын

make video in english

@virutchamtechs9700 21 күн бұрын

I you need whole ngrx in english how

@isatiuak3827 21 күн бұрын

@@virutchamtechs9700 what are you trying to say??? i don't understand write properly.

@virutchamtechs9700 18 күн бұрын

I asked if you need a complete tutorial for NGRX in English.

@virutchamtechs9700 Ай бұрын

action.ts import { createAction,props } from "@ngrx/store"; import { cart } from "./cart.model"; export const loadData= createAction("load carts"); export const addCart = createAction("ADD_CART",props<{cartItems:cart}>()); export const updateCart = createAction('UPDATE_CART',props<{cartItem:cart}>()); export const deletCart = createAction("DELETE_CART",props<{id:number}>()); cart.service.ts import { Injectable } from '@angular/core'; import { Observable } from 'rxjs/internal/Observable' import {of,delay} from 'rxjs' import { cart } from './cart.model'; @Injectable({ providedIn: 'root' }) export class CartService { constructor() { } getAll() : Observable<cart[]>{ return of([ { id: 1, productName: 'makeup kit', qty: 1, price:1000, completed: false }, { id: 1, productName: 'Hair bursh', qty: 1, price:2000, completed: false }, ]).pipe(delay(2000)) } }

@Murugan-t8z 24 күн бұрын

How to contact you? I've a work in angular, happy to pay. Would you be able to help?

@RajapandiKECE Ай бұрын

Thank you, mam Finally, the video I asked for has arrived 😊...

@KarthickRajendran-y2v Ай бұрын

Nice explanation. Expecting more videos from you on ngrx.

@virutchamtechs9700 Ай бұрын

Sure next video is in progress soon it will arrive

@PLATO-en5kp Ай бұрын

thanks🤩

@virutchamtechs9700 Ай бұрын

You're welcome 😊

@jagadeeshvbilzerian7438 Ай бұрын

Vanakkam mam Cross-origin request blocked error proxy CLI method la resolve panna oru video podunga mam I hope you

@virutchamtechs9700 Ай бұрын

Sure

@RajapandiKECE 2 ай бұрын

Hi Mam, kindly Upload... Angular State Management NgRx Topic

@virutchamtechs9700 2 ай бұрын

Sure

@kannank-j5p 2 ай бұрын

ngOnChanges(){ this.parentData.count } nu kudutha work aakuumla sis

@RajapandiKECE 2 ай бұрын

Hi , I want to Angular Redux videos..pls

@virutchamtechs9700 2 ай бұрын

Sure

@RajapandiKECE 2 ай бұрын

Mam Realy awesome ....Your classes 👏

@virutchamtechs9700 2 ай бұрын

Thanks

@RajapandiKECE 2 ай бұрын

@@virutchamtechs9700 "I want to watch a video on NgRx state management with Angular." Kindly pls upload

@manii3930 2 ай бұрын

Your teaching is very well. Keep it. I have followed the same logic. But error showing while getting response from 'assets/config.json' and error as ""Http failure response for localhost:4200/assets/config.json: 404 Not Found"" & { "headers": { "normalizedNames": {}, "lazyUpdate": null }, "status": 404, "statusText": "Not Found", "url": "localhost:4200/assets/config.json", "ok": false, "name": "HttpErrorResponse", "message": "Http failure response for localhost:4200/assets/config.json: 404 Not Found", "error": "<!DOCTYPE html> <html lang=\"en\"> <head> <meta charset=\"utf-8\"> <title>Error</title> </head> <body> <pre>Cannot GET /assets/config.json</pre> </body> </html> " } and template as below as <div *ngIf="empData"> <div>Emp Name: {{empData.name}}</div> <div>Place: {{empData.place}}</div> <div>Designation: {{empData.designation}}</div> <div>Salary: {{empData.salary}}</div> </div>

@RKGamer-se2ku 2 ай бұрын

Indexedb angular la eppati use panrathu nu podunka

@virutchamtechs9700 2 ай бұрын

Sure

@PLATO-en5kp 2 ай бұрын

thankk uuuuuuu

@manii3930 3 ай бұрын

Your explanation is very nice. Keep this sister. After set property binding,image not displaying my code in ts file is imageUrl="assets/logo.png"; and In html file as "<img [src]="imageUrl"/>".And also not working without property binding like <img src="assets/logo.png"/>.Any thing,Image not displaying.But image is available in assets folder.How to rectify this?

@virutchamtechs9700 3 ай бұрын

Bro. You path is wrong so only not displaying for test purpose. You can copy full path of image and check then you know what mistake you done. According to folder structure path will be different like example ../../ assets/ images some time for another component it will differ ./assets/img.png

@ncyn2122-h2r 4 ай бұрын

Great explanation

@virutchamtechs9700 3 ай бұрын

Thanks

@spmyasar 4 ай бұрын

nice explanation getting easy understand

@vijayamurugan2023 4 ай бұрын

thank you so much Mam

@virutchamtechs9700 4 ай бұрын

Your asked about interview questions video. If you learn all topics of angular itself enough to attend interview. Prepare angular well goes to interview bit website for angular recall the things. It will help don't learn questions a nd answer if you know all topics about angular that's enough to attend interview

@ashkkarsidhik923 4 ай бұрын

Mam angular 17 la app.module page varamaatingudhu, so Formsmodule and reactivemodule endha page la import pannanum please sollunga?

@virutchamtechs9700 4 ай бұрын

Yentha component form module use pannrom same component import it and add in the import inside of @ component

@virutchamtechs9700 4 ай бұрын

Standalone video is there check that for refer kzbin.info/www/bejne/h3enYop4jNl4hac

@ashkkarsidhik923 4 ай бұрын

Mam ngForm use panna no directives found nu varudhu adhu epdi solve panradhu?

@virutchamtechs9700 4 ай бұрын

Import the library I explain in the video also watch properly use this import { FormGroup, FormControl, Validators, FormBuilder } from '@angular/forms';

@ashkkarsidhik923 4 ай бұрын

@@virutchamtechs9700 mam angular17 la app.module page varala, so namma formsmodule enga register panradhu?

@prasathk1414 4 ай бұрын

need package.json and angular.json explanation mam

@virutchamtechs9700 4 ай бұрын

Sure

@vijayamurugan2023 5 ай бұрын

Thanks so much mam

@virutchamtechs9700 5 ай бұрын

It's my pleasure

@sangeethas3781 5 ай бұрын

Good explanation

@navinknd 5 ай бұрын

Nice explanation, Nan angular developer ah 3 years work paniruken enaku oru prblm eputi documentation write pantrathu angular application ku help panunga. Like Code document if possible project documentation oru idea venum eduku reply paninga Ilana edu related ah oru video potta rompa useful ahh irukum

@virutchamtechs9700 5 ай бұрын

What kind of documentation need I am not getting actually for project we create SDD [email protected] can you sent details to my mail I will check it

@anithaalagar1629 5 ай бұрын

Why using 3 components mam

@virutchamtechs9700 5 ай бұрын

Just for understanding, I made this so you can make it into a single component. When it comes to the project, it may work out like this, so I thought of it in this way.

@anithaalagar1629 5 ай бұрын

Thank you for sharing mam ☺️☺️

@anithaalagar1629 5 ай бұрын

Thank you so much mam... clearly understand this hook 💥

@vijayamurugan2023 5 ай бұрын

please update rxjs details video mam

@virutchamtechs9700 5 ай бұрын

Sure as soon as possible by

@vijayamurugan2023 5 ай бұрын

Your videos are very good... pls update project videos... and angular.. interview questions pls update...

@virutchamtechs9700 5 ай бұрын

Sure what kind of project videos you need

@virutchamtechs9700 5 ай бұрын

Try the code //a component <p> ngAfterContent </p> <p> I am a </p> <app-b> <h3 #BHeader>BComponent Content DOM</h3> </app-b> //b component <p>I am bcomponent </p> <app-c></app-c> <button (click)="$event" > click </button> <ng-content> </ng-content> //b compoenent.ts import { Component , AfterContentChecked,AfterContentInit,ContentChild,Renderer2,ElementRef,OnInit,viewChild,AfterViewInit, ViewChild } from '@angular/core'; import { CComponent } from '../c/c.component'; @Component({ selector: 'app-b', standalone: true, imports: [CComponent], templateUrl: './b.component.html', styleUrl: './b.component.css' }) export class BComponent implements AfterContentChecked,AfterContentInit,OnInit,AfterViewInit { @ContentChild("BHeader",{read:ElementRef}) hRef:ElementRef |undefined @ViewChild(CComponent,{read:ElementRef}) cRef:ElementRef |undefined constructor(private renderer:Renderer2) { console.log("constructor") } ngAfterViewInit(): void { console.log("ngafterviewinit") this.renderer.setStyle(this.cRef?.nativeElement.children.item(0),'background-color',this.randomRGB()) this.renderer.setStyle(this.cRef?.nativeElement.children.item(1),'background-color',this.randomRGB()) } ngOnInit(): void { console.log("ngInit",this.hRef) } ngAfterContentChecked(): void { console.log("ngaftercontentchecked",this.hRef) this.renderer.setStyle(this.hRef?.nativeElement,'background-color',this.randomRGB()) } ngAfterContentInit(): void { console.log("ngAfterContentInit",this.hRef) } randomRGB(): string { return `rgb(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)})`; } } //C component <p> I am C component </p> <h2> welcome to life cycle </h2>

@virutchamtechs9700 5 ай бұрын

Try below code //a component html <h1> ngAfterContentChecked Example </h1> <p> I am A. </p> <app-b> <h3 #BHeader>BComponent Content DOM</h3> <app-c> </app-c> </app-b> //b Component html <p> I am b</p> <p #BStatement>I am B.</p> <button (click)="$event"> Click </button> <ng-content></ng-content> //bcompoennt.ts import { Component , AfterContentChecked,AfterContentInit,ContentChild,Renderer2,ElementRef,OnInit,viewChild,AfterViewInit, ViewChild } from '@angular/core'; import { CComponent } from '../c/c.component'; @Component({ selector: 'app-b', standalone: true, imports: [CComponent], templateUrl: './b.component.html', styleUrl: './b.component.css' }) export class BComponent implements AfterContentChecked,AfterContentInit,OnInit,AfterViewInit { @ContentChild("BHeader",{read:ElementRef}) hRef:ElementRef |undefined @ViewChild(CComponent,{read:ElementRef}) cRef:ElementRef |undefined constructor(private renderer:Renderer2) { console.log("constructor") } ngAfterViewInit(): void { console.log("ngafterviewinit") this.renderer.setStyle(this.cRef?.nativeElement.children.item(0),'background-color',this.randomRGB()) this.renderer.setStyle(this.cRef?.nativeElement.children.item(1),'background-color',this.randomRGB()) } ngOnInit(): void { console.log("ngInit",this.hRef) } ngAfterContentChecked(): void { console.log("ngaftercontentchecked",this.hRef) this.renderer.setStyle(this.hRef?.nativeElement,'background-color',this.randomRGB()) } ngAfterContentInit(): void { console.log("ngAfterContentInit",this.hRef) } randomRGB(): string { return `rgb(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)})`; } } //c compoent.html <p>I am c </p> <P> Hello wordld</P>

@anithaalagar1629 5 ай бұрын

Okay mam I'll try

@34-jeevar98 5 ай бұрын

nice explaintion mam ,thank you

@vijayamurugan2023 5 ай бұрын

your videos so good.... but voice is not clear pls check

@virutchamtechs9700 5 ай бұрын

Sure. Thanks

@anithaalagar1629 6 ай бұрын

What about lifecyclehooks 5,6,7,8 Sister

@virutchamtechs9700 6 ай бұрын

Soon I will update long time can't make video. Soon as possible I will upload all videos

@anithaalagar1629 6 ай бұрын

@@virutchamtechs9700 eagerly waiting sister please upload soon

@virutchamtechs9700 6 ай бұрын

@@anithaalagar1629 sure

@virutchamtechs9700 5 ай бұрын

kzbin.info/www/bejne/aZCyfa2CoalmbrM life hooks part 5 sure by next week upcoming video will come

@anithaalagar1629 5 ай бұрын

Okay Mam thank you 😊😊

@muthuvel7047 7 ай бұрын

Mam error varuthu mam Templateurl: './child.component.html', Ipdi varuthu

@virutchamtechs9700 6 ай бұрын

Sent your code to my email id [email protected] I will let you know

@hariharans4669 8 ай бұрын

Property means what mam

@virutchamtechs9700 6 ай бұрын

kzbin.info/www/bejne/bnyTon-qlJ5rpLs check it out you will get clear about property

@virutchamtechs9700 6 ай бұрын

kzbin.info/www/bejne/bnyTon-qlJ5rpLs check this video you get clear info of property

@virutchamtechs9700 6 ай бұрын

Try example which done you know how it's work also

@japarsg 8 ай бұрын

Epdi update value ah send pandrathu without two way binding.. Nan default oru value ah send pandren, aprm page load aanathuku aprm oru method la same variable ah update.. But updated value pogala. Athu epdi pandreathu

@virutchamtechs9700 8 ай бұрын

Use observable method that also I attached video kzbin.info/www/bejne/rWO0iKdpYtypoKM

@Mrtomboy143 8 ай бұрын

❤

@virutchamtechs9700 5 ай бұрын

Thanks

@jagadeeshvbilzerian7438 9 ай бұрын

Angular video potadhuku nandri akka

@vigneshkuttyvicky8027 9 ай бұрын

Thank you sister

@virutchamtechs9700 6 ай бұрын

Welcome

@saleembasha9024 9 ай бұрын

Thank you so much very nice explanation

@ssathyan-i5v 10 ай бұрын

Hey , really good explain to all topic .... All the best

@virutchamtechs9700 10 ай бұрын

Thanks

@virutchamtechs9700 10 ай бұрын

Thanks

@NGNWeb 11 ай бұрын

Super, Pls upload the next video

@virutchamtechs9700 11 ай бұрын

Sure soon I will

@Yuvinaa828 11 ай бұрын

nice and thank you for ur presendation

@vigneshwaran.m3674 Жыл бұрын

akka one request neega video panum podhu andha sample code reference la poduga..

@virutchamtechs9700 11 ай бұрын

Sample reference code will be in comment section i pinned there please check kindly

@sangeethas3781 11 ай бұрын

Please check in description of video if code is not in comment section it will be in description

@vigneshwaran.m3674 Жыл бұрын

neenga pana andha child compennets theliva konjam explain panuga akka....atleast aathula full code aavathu comment la poduga akka

@virutchamtechs9700 6 ай бұрын

Code comments erukum Nala check panni parunga. Video correct ah follow Pannu kandipa work agum once again try panni paruga

@vigneshwaran.m3674 Жыл бұрын

akka no error but aathu output yedhuvum print aagala..

@virutchamtechs9700 6 ай бұрын

Use console and check it

@vigneshwaran.m3674 Жыл бұрын

1. If 'app-student-profile' is an Angular component and it has 'message' input, then verify that it is part of this module. 2. If 'app-student-profile' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. 1 <app-student-profile [message]="messageData"> </app-student-profile> ~~~~~~~~~~~~~~~~~~~~~~~ src/app/app.component.ts:6:16 6 templateUrl: './app.component.html', ~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component AppComponent. × Failed to compile.

@vigneshwaran.m3674 Жыл бұрын

Property 'blue' does not exist on type 'AppComponent'. akka color single style binding la varala

@virutchamtechs9700 Жыл бұрын

Spelling caps yellam correct check panni paruga

@RaJkUmAr-Sps Жыл бұрын

Thank you very much madam I could not correct this error for 2 days.. I understood after watching this video

Ең жақсы KZbin

Пікірлер