https://github.com/imtiajahammad/angularcrud
This is the consumer application for the asp.net core web API. It is just to practice angular services for integrating with asp.net core rest apis
https://github.com/imtiajahammad/angularcrud
angular bootstrap components filtering registermodules routing services sorting typescript
Last synced: 2 months ago
JSON representation
This is the consumer application for the asp.net core web API. It is just to practice angular services for integrating with asp.net core rest apis
- Host: GitHub
- URL: https://github.com/imtiajahammad/angularcrud
- Owner: imtiajahammad
- Created: 2022-10-15T05:26:50.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2022-10-16T04:15:16.000Z (over 3 years ago)
- Last Synced: 2025-03-16T09:34:18.014Z (over 1 year ago)
- Topics: angular, bootstrap, components, filtering, registermodules, routing, services, sorting, typescript
- Language: HTML
- Homepage:
- Size: 223 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# AngularCRUD
This is the consumer application for the asp.net core web API. It is just to practice angular services for integrating with asp.net core rest apis
Producer REST API Application: https://github.com/imtiajahammad/EmployeeMCrud
Reference :
https://www.c-sharpcorner.com/article/angular-crud-using-net-core-web-api/
Key features:
* Create Angular App
* Adding Services
* Adding Components
* Adding Bootstrap
* Register modules
* Add Routing
* Navigating menus for routing
* Adding component codes
* Filtering & Sorting
Commands:
* ng new AngularCRUD
* ng serve -o
* ng serve -open
* ng g c department
* ng g c department/add-edit-department
* ng g c department/show-department
* ng g c employee
* ng g c employee/add-edit-employee
* ng g c employee/show-employee
* ng g s apiservice
Adding Bootstrap:
1. Go to https://getbootstrap.com/
2. copy bootstrap.min.css and bootstrap.bundle.min.js links
3. Open index.html page and paste .css link in the head section and .js after body section
Register Modules:
1. add services in providers in app.module.ts
2. add imports in app.module.ts for HttpClient,FormsModule,ReactiveFormsModule
Add Routing:
1. adding routes for department in app-routing.module.ts for routes
2. adding routes for employee in app-routing.module.ts for routes
Navigating menus for routing:
1. Open app.component.html
2. add navigations
Adding service, component codes & Filtering & Sorting
1. Injecting httpClient into constractor
2. adding functions for department apis
3. Adding functions for employee apis
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.1.0.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
## Further help
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.