1.Download & Install Node JS on your PC 2.Install Angular CLI globally 3.Choose the best text editor for you
Reference link - https://peakup.org/blog/how-to-setup-angular-6-environment-on-windows/
ng new project_name
Open project in browser :
ng serve --open
Create ng component :
ng generate component sidebar
Steps:
1.change html in app.component.html
2.change html in sidebar.component.html
3. add css in style.scss
4.change scss in sidebar.component.scss
5. add routing in app-routing.modules.ts (imporing the class->import { UsersComponent } from './users/users.component';)
6.create services to fetch data from api (ng generate service data)
7. to use services we want http client(import htttpclient in data.service.ts)
8. User public api for demo https://jsonplaceholder.typicode.com/users
9. import the httmpclient module in app.module.ts
10. add the detaservice in users.component.ts and then consume the service in component.
11. to use the cotroler as path includes in component.ts file(import { ActivatedRoute } from '@angular/router';)
app.module.ts ->it has some libraries which are imported and also a declarative which is assigned the appcomponent.app component which is created by default will always remain the parent
a>change the index.html <base href="/"> to <base href="./">
b> then run the command ->ng build --prod
c>then copy the dist folder in xampp/htdocs
Object.keys(localStorage)
[] is for binding from a value in the parent component to an @Input() in the child component. It allows to pass objects.
{{}} is for binding strings in properties and HTML like.
() is for binding an event handler to be called when a DOM event is fired or an EventEmitter on the child component emits an event.
Router-outlet in Angular works as a placeholder which is used to load the different components dynamically based on the activated component or current route state. Navigation can be done using router-outlet directive and the activated component will take place inside the router-outlet to load its content.