Как связать front-end на Angular и back-end asp.net core?

Связка между фронтендом на Angular и бэкендом на ASP.NET Core обеспечивается посредством взаимодействия через HTTP протокол с использованием REST API.

Прежде всего, необходимо создать бэкенд на ASP.NET Core. Для этого можно использовать заготовку проекта "ASP.NET Core Web API", которая предлагает базовую структуру и настройки для создания веб-сервиса.

После создания бэкенда необходимо настроить CORS (Cross-Origin Resource Sharing) для разрешения cross-origin запросов со стороны фронтенда на Angular. Для этого можно использовать пакет Microsoft.AspNetCore.Cors и добавить соответствующую конфигурацию в метод ConfigureServices():

services.AddCors(options =>
{
    options.AddPolicy("AllowOrigin",
        builder => builder.WithOrigins("http://localhost:4200")
                          .AllowAnyHeader()
                          .AllowAnyMethod());
});

Далее необходимо создать контроллеры, которые будут отвечать на запросы со стороны фронтенда. Контроллеры должны быть помечены атрибутом [ApiController] и описывать методы, которые принимают данные и возвращают результаты в формате JSON.

Пример контроллера, который обрабатывает GET запрос на получение данных:

[Route("api/[controller]")]
[ApiController]
public class UsersController : ControllerBase
{
    private readonly IUserService _userService;

    public UsersController(IUserService userService)
    {
        _userService = userService;
    }

    [HttpGet]
    public IActionResult GetUsers()
    {
        var users = _userService.GetUsers();
        return Ok(users);
    }
}

Фронтенд на Angular может обращаться к бэкенду с использованием модуля HttpClient, который предоставляет возможность выполнения HTTP запросов.

Пример сервиса, который выполняет GET запрос на бэкенд:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { User } from './user.model';

@Injectable()
export class UserService {
    private apiUrl = 'http://localhost:5000/api/users';

    constructor(private http: HttpClient) { }

    getUsers(): Observable<User[]> {
        return this.http.get<User[]>(this.apiUrl);
    }
}

Пример компонента Angular, который использует сервис UserService для получения данных с бэкенда:

import { Component, OnInit } from '@angular/core';
import { UserService } from './user.service';
import { User } from './user.model';

@Component({
    selector: 'app-users',
    templateUrl: './users.component.html',
    styleUrls: ['./users.component.css']
})
export class UsersComponent implements OnInit {
    users: User[];

    constructor(private userService: UserService) { }

    ngOnInit() {
        this.userService.getUsers().subscribe(users => {
            this.users = users;
        });
    }
}

Таким образом, фронтенд на Angular и бэкенд на ASP.NET Core могут связываться между собой, обмениваться данными и выполнять нужные операции, используя стандартные принципы REST API.