Posts

Angular 9 Template and Model Driven Forms

Image
Hello Friends, In this tutorial, we will be discussing about Template Driven and Model Driven Form creation. Model Driven Form: In Model driven form,  app.module.ts need to be updated  import { ReactiveFormsModule } from '@angular/forms' ; and need to be imported in Imported Array. import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpClientModule } from '@angular/common/http'; import { RouterModule } from '@angular/router'; import { AppComponent } from './app.component'; import { NavMenuComponent } from './nav-menu/nav-menu.component'; import { HomeComponent } from './home/home.component'; import { CounterComponent } from './counter/counter.component'; import { FetchDataComponent } from './fetch-data/fetch-data.component'; import { HttpService } from './services/http.service...

How to Integrate Angular with a .NET Core Project

Image
Create a new ASP.NET Core Web Application: Select Angular and Click on OK. Create a API Controller and get action which will act as endpoint for the class. Add below code in API. // GET api/values [HttpGet] public ActionResult<IEnumerable<string>> Get() { return new string[] { "value1", "value2" }; } // GET api/values/5 [HttpGet("{id}")] public ActionResult<string> Get(int id) { return "value"; } // POST api/values [HttpPost] public void Post([FromBody] string value) { } // PUT api/values/5 [HttpPut("{id}")] public void Put(int id, [FromBody] string value) { } // DELETE api/values/5 [HttpDelete("{id}")] public void Delete(int id) { } Run the code and change t...

Part 1- Creating Angular 9 Project

Image
Hello Friends, This is my first session on Angular 9 tutorials. In the tutorial, we will be learning about  1.Setting up Angular 9 development Environment.   2.Secondly ,We will be creating a new Angular 9 Project. Initial Requirement for Angular Node JS 8.x or later NPM . Angular CLI To download NodeJS , you can download https://nodejs.org/en/ . If NodeJS is already installed you can check the version using. node -v If NPM is already installed you can check the version using. NPM -v Install Angular CLI 9 or later: npm install -g @angular/cli Update to Angular: npm install -g @angular/cli@latest Since you have understood the setup for angular , We will create angular project. you can also create project using command line argument. First we will be checking the command to see what all files generated using dry run option. For Generating the physical file we use the command Ng new Angular9Project Your first Angular application i...