如何在 Angular 客户端为 cqrs 模式 API 创建 crud 模型？

Question

I implement web API in ASP.net core in CQRS Pattent and using mediatR library I have separate model Like CreatePartyCommand, UpadatePartyCommand, DeletePartyCommand, PartyViewModel, PartyQuery

public class CreatePartyCommand : IRequest<int>
{
    public string Name { get; set; }

    public string Family { get; set; }

    public long Code { get; set; }

    public string Title { get; set; }
}

public class UpdatePartyCommand : IRequest<int>
{
    public int Id { get; set; }

    public string Name { get; set; }

    public string Family { get; set; }

    public long Code { get; set; }

    public string Title { get; set; }

}

public class DeletePartyCommand : IRequest
{
    public int Id { get; set; }
}

[Route("api/[controller]")]
[ApiController]
public class PartyController : ControllerBase
{
    private readonly IMediator _mediator;

    public PartyController(IMediator mediator)
    {
        _mediator = mediator;
    }

    [HttpGet]
    public async Task<ActionResult<IEnumerable<PartyViewModel>>> Get([FromQuery] PartyQuery partyQuery)
    {
        return Ok(await _mediator.Send(partyQuery));
    }

    [HttpPost]
    public async Task<ActionResult<int>> Create([FromBody] CreatePartyCommand command)
    {
        var productId = await _mediator.Send(command);

        return Ok(productId);
    }

    [HttpPut]
    [ProducesResponseType(StatusCodes.Status204NoContent)]
    [ProducesDefaultResponseType]
    public async Task<IActionResult> Update([FromBody] UpdatePartyCommand command)
    {
        await _mediator.Send(command);

        return NoContent();
    }

    [HttpDelete("{id}")]
    [ProducesResponseType(StatusCodes.Status204NoContent)]
    [ProducesDefaultResponseType]
    public async Task<IActionResult> Delete(int id)
    {
        await _mediator.Send(new DeletePartyCommand { Id = id });

        return NoContent();
    }
}

In client side I have a component for Party List that paged data and bind to PartyViewModel[] and one or two (I don't know guide me please) component for add and update

How should I design DataModels in client side or what changes made in server side to complete CRUD scenario?

Answer 1

You just need one interface to type your objects.

export interface IParty {
  Id?: number;
  Name: string;
  Family: string;
  Code: number;
  Title: string;
}

Example for POST:

service:

create(party: IParty): Promise<IParty> {
  return this.http.post('link', party).toPromise();
}

component

async createParty(party: IParty): Promise<void> {
  const party = await this.partyService.create(party); // if you use promise you should put this code in a try-catch block
}