Angular

TEMPLATE SETUP IN ANGULAR

1. Create an Angular App using angular CLIng new angular-templat 2. copy all the files and folder and paste it in the src > assets folder expect the HTML file. 3. Then include your all css files into the angular.json file like this ex.“styles”: [ “src/styles.css”, “src/assets/css/custom.css”, “src/assets/vendor/bootstrap/css/bootstrap.min.css”, “src/assets/vendor/font-awesome/css/font-awesome.min.css”, “src/assets/css/fontastic.css”, “src/assets/css/grasp_mobile_progress_circle-1.0.0.min.css”, “src/assets/vendor/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css”, “src/assets/css/style.default.css” ], 4. […]

Angular

GET QUERY STRING PARAMETERS

1. add this line in ts file:import {Router, ActivatedRoute, Params} from ‘@angular/router’; 2. add below line in constructor:constructor(private activatedRoute: ActivatedRoute) {} 3. in ndOnInit(){} put below code:ngOnInit() {// Note: Below ‘queryParams’ can be replaced with ‘params’ depending on your requirementsthis.activatedRoute.queryParams.subscribe(params => {const token = params[‘token’];console.log(token);});}

Angular

DATEPICKER

1. npm install ng2-datepicker –save 2. import in app.module.tsimport { NgDatepickerModule } from ‘ng2-datepicker’;imports: [NgDatepickerModule] 3. import nelow in component.tsimport { DatepickerOptions } from ‘ng2-datepicker’;import * as frLocale from ‘date-fns/locale/fr’; 4. Before constructore add below code:date:any=new Date(Date.now());options: DatepickerOptions = {minYear: 1970,maxYear: 2030,displayFormat: ‘MMM D[,] YYYY’,barTitleFormat: ‘MMMM YYYY’,dayNamesFormat: ‘dd’,firstCalendarDay: 0, // 0 – Sunday, 1 – […]

Angular

CALL PHP API IN ANGULAR

.ts=controllerhtml inside component 1. npm install -g @angular/cli>> some bugs come so installed noje , node js, npm 2. create one folder : angular-php-app 3. ng new frontend 4. cd frontend 5. ng serve>> Now default angular screen will display 6. import HttpClientModule, and FormsModule>> Open the src/app/app.module.ts file>> add this 2 lines :import { […]