app_component.ts

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'app';
  model: usuarioModel[];

  constructor(private http: HttpClient) {}

  ngOnInit(): void {
    this.http
      .get<usuarioModel[]>('http://localhost:5000/api/values')
      .subscribe(res => {
        this.model = res;
      });
  }
}

export interface usuarioModel {
  id: number;
  nombre: string;
}

app_component_html

<h2>Lista de usuarios:</h2>
<ul *ngIf="model">
  <li *ngFor="let usuario of model">
    <h2>{{usuario.nombre}}</h2>
  </li>
</ul>

app_module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { HttpClientModule } from '../../node_modules/@angular/common/http';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, HttpClientModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

comenzando-angular6-webapi-1

C:\..> cd angular6_webapi
C:\..> npm install -g @angular/cli

C:\Users\mpetrini\AppData\Roaming\npm\ng -> C:\Users\mpetrini\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng

> @angular/[email protected] postinstall C:\Users\mpetrini\AppData\Roaming\npm\node_modules\@angular\cli
> node ./bin/ng-update-message.js

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\@angular\cli\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ @angular/[email protected]
added 2 packages from 4 contributors, removed 8 packages and updated 21 packages in 97.429s

comenzando-angular6-webapi-2

C:\..\angular6_webapi>ng new front
CREATE front/angular.json (3539 bytes)
CREATE front/package.json (1309 bytes)
CREATE front/README.md (1022 bytes)
CREATE front/tsconfig.json (384 bytes)
CREATE front/tslint.json (2805 bytes)
CREATE front/.editorconfig (245 bytes)
CREATE front/.gitignore (503 bytes)
...

startup.cs

// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
    services.AddCors();
    services.AddMvc();
}

// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }

    app.UseCors(opt => opt.WithOrigins("http://localhost:4200"));

    app.UseMvc();
}

values-controller.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace api.Controllers
{
    [Route("api/[controller]")]
    public class ValuesController : Controller
    {
        // GET api/values
        [HttpGet]
        public IEnumerable<dynamic> Get()
        {
            return new List<dynamic>() { new { Id = 1, Nombre = "usuario" }, new { Id = 2, Nombre = "usuario2" }, new { Id = 3, Nombre = "usuario3" }, };
        }
    }
}