使用angular4和asp.net core 2 web api做個練習專案(一)

solenovex發表於2017-10-31

AngularASP.NETWebAPI

這是一篇學習筆記. angular 5 正式版都快出了, 不過主要是效能升級.

我認為angular 4還是很適合企業的, 就像.net一樣.

我用的是windows 10

安裝工具:

git for windows: 官網很慢, 所以找一個映象站下載: https://github.com/waylau/git-for-win, 淘寶映象的速度還是蠻快的:

安裝的時候, 建議選擇這個, 會新增很多命令列工具:

nodejs: 去官網下載就行: https://nodejs.org/en/

正常安裝即可. npm的版本不要低於5.0吧:

angular-cli, 官網: https://github.com/angular/angular-cli

npm install -g @angular/cli

visual studio code: https://code.visualstudio.com/

and visual studio 2017 of course.

建立angular專案

進入命令列在某個地方執行命令:

ng new client-panel

這就會建立一個client-panel資料夾, 裡面是該專案的檔案, 然後它會立即執行npm install命令(這裡不要使用淘寶的cnpm進行安裝, 有bug), 稍等一會就會結束.

使用vscode開啟該目錄, 然後在vscode裡面開啟terminal:

terminal預設的可能是powershell, 如果你感覺powershell有點慢的話, 可以換成bash(安裝git時候帶的)或者windows command line等.

第一次開啟terminal的時候, vscode上方會提示你配置terminal, 這時就可以更換預設的terminal. 否則的話, 你可以點選選單file-reference-settings, 自己選擇一個terminal應用:

同樣可以安裝幾個vscode的外掛:

然後試執行一下專案, 在terminal執行 ng serve, 如果沒問題的話, 大概是這樣:

瀏覽器執行: http://localhost:4200

安裝bootstrap4等:

安裝bootstrap4, tether, jquery等:

npm install bootstrap@4.0.0-beta.2 tether jquery --save

安裝成功後, 開啟 .angular-cli.json, 把相關的css和js新增進去:

然後在執行試試 ng serve, 重新整理:

字型已經改變, bootstrap起作用了.

建立Components

建立dashboard:

terminal執行

ng g component components/dashboard

執行成功後會生成4個檔案:

並且會自動在app.module.ts裡面宣告:

建立其他 components:

ng g component components/clients
ng g component components/clientDetails
ng g component components/addClient
ng g component components/editClient
ng g component components/navbar
ng g component components/sidebar
ng g component components/login
ng g component components/register
ng g component components/settings
ng g component components/pageNotFound

建立Route路由

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { AppComponent } from './app.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { ClientsComponent } from './components/clients/clients.component';
import { ClientDetailsComponent } from './components/client-details/client-details.component';
import { AddClientComponent } from './components/add-client/add-client.component';
import { EditClientComponent } from './components/edit-client/edit-client.component';
import { NavbarComponent } from './components/navbar/navbar.component';
import { SidebarComponent } from './components/sidebar/sidebar.component';
import { LoginComponent } from './components/login/login.component';
import { RegisterComponent } from './components/register/register.component';
import { SettingsComponent } from './components/settings/settings.component';
import { PageNotFoundComponent } from './components/page-not-found/page-not-found.component';

const appRoutes: Routes = [
  { path: '', component: DashboardComponent },
  { path: 'register', component: RegisterComponent },
  { path: 'login', component: LoginComponent }
];

@NgModule({
  declarations: [
    AppComponent,
    DashboardComponent,
    ClientsComponent,
    ClientDetailsComponent,
    AddClientComponent,
    EditClientComponent,
    NavbarComponent,
    SidebarComponent,
    LoginComponent,
    RegisterComponent,
    SettingsComponent,
    PageNotFoundComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

新增router-outlet:

開啟app.component.html, 清空內容, 新增一個div(可以輸入div.container然後按tab健):

<div class="container">
  <router-outlet></router-outlet>
</div>

現在重新整理瀏覽器, 大約這樣:

新增navbar:

修改navbar.component.html:

<nav class="navbar navbar-expand-md navbar-light bg-light">
  <div class="container">
    <a class="navbar-brand" href="#">Client Panel</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault"
      aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarsExampleDefault">
      <ul class="navbar-nav mr-auto">
        <li class="nav-item">
          <a class="nav-link" href="#" routerLink="/">Dashboard </a>
        </li>
      </ul>
      <ul class="navbar-nav ml-auto">
        <li class="nav-item">
          <a class="nav-link" href="#" routerLink="/register">Register </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#" routerLink="/login">Login </a>
        </li>
      </ul>
    </div>
  </div>
</nav>

修改app.component.html:

<app-navbar></app-navbar>
<div class="container">
  <router-outlet></router-outlet>
</div>

執行:

建立Service

建立一個client.service:

ng g service services/client

然後在app.module.ts新增引用:

// Services Imports
import { ClientService } from "./services/client.service";

並新增在providers裡:

  providers: [
    ClientService
  ],

前端先暫時到這, 現在開始搞後端 web api.

建立asp.net core 2.0 的 Web api專案

web api專案原始碼: https://github.com/solenovex/asp.net-core-2.0-web-api-boilerplate

專案列表如圖:

AspNetIdentityAuthorizationServer是一個單獨的authorization server, 這裡暫時還沒用到, 它的埠是5000, 預設不啟動.

CoreApi.Infrastructure 裡面有一些基類和介面, 還放了一個公共的工具類等.

CoreApi.Models就是 models/entities

CoreApi.DataContext 裡面就是DbContext相關的

CoreApi.Repositories 裡面是Repositories

CoreApi.Services 裡面就是各種services

CoreApi.ViewModels 裡面就是各種ViewModels或者叫Dtos

CoreApi.Web是web啟動專案.

SharedSettings是橫跨authorization server和 web api的一些公共設定.

上面說的這些都沒什麼用, 下面開始建立Client的api.

建立Client Model(或者叫Entity)

在CoreApi.Models建立資料夾Angular, 然後建立Client.cs:

using CoreApi.Infrastructure.Features.Common;
using Microsoft.EntityFrameworkCore;
using Microsoft.EntityFrameworkCore.Metadata.Builders;

namespace CoreApi.Models.Angular
{
    public class Client : EntityBase
    {
        public decimal Balance { get; set; }
        public string Email { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Phone { get; set; }
    }

    public class ClientConfiguration : EntityBaseConfiguration<Client>
    {
        public override void ConfigureDerived(EntityTypeBuilder<Client> builder)
        {
            builder.Property(x => x.Balance).HasColumnType("decimal(18,2)");
            builder.Property(x => x.Email).IsRequired().HasMaxLength(100);
            builder.Property(x => x.FirstName).IsRequired().HasMaxLength(50);
            builder.Property(x => x.LastName).IsRequired().HasMaxLength(50);
            builder.Property(x => x.Phone).HasMaxLength(50);
        }
    }
}

其中父類EntityBase裡面含有一些通用屬性,Id, CreateUser, UpdateUser, CreateTime, UpdateTime, LastAction, 這些是我公司做專案必須的, 你們隨意.

下面ClientConfiguration是針對Client的fluent api配置類. 他的父類EntityBaseConfiguration實現了EF的IEntityTypeConfiguration介面, 並在父類裡面針對EntityBase那些屬性使用fluent api做了限制:

namespace CoreApi.Infrastructure.Features.Common
{
    public abstract class EntityBaseConfiguration<T> : IEntityTypeConfiguration<T> where T : EntityBase
    {
        public virtual void Configure(EntityTypeBuilder<T> builder)
        {
            builder.HasKey(e => e.Id);
            builder.Property(x => x.CreateTime).IsRequired();
            builder.Property(x => x.UpdateTime).IsRequired();
            builder.Property(x => x.CreateUser).IsRequired().HasMaxLength(50);
            builder.Property(x => x.UpdateUser).IsRequired().HasMaxLength(50);
            builder.Property(x => x.LastAction).IsRequired().HasMaxLength(50);

            ConfigureDerived(builder);
        }

        public abstract void ConfigureDerived(EntityTypeBuilder<T> b);
    }
}

弄完Model和它的配置之後, 就新增到DbContext裡面. 開啟CoreApi.DataContext的CoreContext, 新增Model和配置:

        protected override void OnModelCreating(ModelBuilder modelBuilder)
        {
            base.OnModelCreating(modelBuilder);
            modelBuilder.HasDefaultSchema(AppSettings.DefaultSchema);

            modelBuilder.ApplyConfiguration(new UploadedFileConfiguration());
            modelBuilder.ApplyConfiguration(new ClientConfiguration());
        }

        public DbSet<UploadedFile> UploadedFiles { get; set; }
        public DbSet<Client> Clients { get; set; }

然後建立ClientRepository

在CoreApi.Repositories裡面建立Angular目錄, 建立ClientRepository.cs:

namespace CoreApi.Repositories.Angular
{
    public interface IClientRepository : IEntityBaseRepository<Client> { }

    public class ClientRepository : EntityBaseRepository<Client>, IClientRepository
    {
        public ClientRepository(IUnitOfWork unitOfWork) : base(unitOfWork)
        {
        }
    }
}

圖省事, 我把repository和它的interface放在一個檔案了.

IEntityBaseRepository<T>定義了一些常用的方法:

namespace CoreApi.DataContext.Infrastructure
{
    public interface IEntityBaseRepository<T> where T : class, IEntityBase, new()
    {
        IQueryable<T> All { get; }
        IQueryable<T> AllIncluding(params Expression<Func<T, object>>[] includeProperties);

        int Count();
        Task<int> CountAsync();
        T GetSingle(int id);
        Task<T> GetSingleAsync(int id);
        T GetSingle(Expression<Func<T, bool>> predicate);
        Task<T> GetSingleAsync(Expression<Func<T, bool>> predicate);
        T GetSingle(Expression<Func<T, bool>> predicate, params Expression<Func<T, object>>[] includeProperties);
        Task<T> GetSingleAsync(Expression<Func<T, bool>> predicate, params Expression<Func<T, object>>[] includeProperties);
        IQueryable<T> FindBy(Expression<Func<T, bool>> predicate);
        void Add(T entity);
        void Update(T entity);
        void Delete(T entity);
        void DeleteWhere(Expression<Func<T, bool>> predicate);
        void AddRange(IEnumerable<T> entities);
        void DeleteRange(IEnumerable<T> entities);
        void Attach(T entity);
        void AttachRange(IEnumerable<T> entities);
        void Detach(T entity);
        void DetachRange(IEnumerable<T> entities);
        void AttachAsModified(T entity);
    }
}

EntityBaseRepository<T>是它的實現:

namespace CoreApi.DataContext.Infrastructure
{
    public class EntityBaseRepository<T> : IEntityBaseRepository<T>
        where T : class, IEntityBase, new()
    {
        #region Properties
        protected CoreContext Context { get; }

        public EntityBaseRepository(IUnitOfWork unitOfWork)
        {
            Context = unitOfWork as CoreContext;
        }
        #endregion

        public virtual IQueryable<T> All => Context.Set<T>();

        public virtual IQueryable<T> AllIncluding(params Expression<Func<T, object>>[] includeProperties)
        {
            IQueryable<T> query = Context.Set<T>();
            foreach (var includeProperty in includeProperties)
            {
                query = query.Include(includeProperty);
            }
            return query;
        }

        public virtual int Count()
        {
            return Context.Set<T>().Count();
        }

        public async Task<int> CountAsync()
        {
            return await Context.Set<T>().CountAsync();
        }

        public T GetSingle(int id)
        {
            return Context.Set<T>().FirstOrDefault(x => x.Id == id);
        }

        public async Task<T> GetSingleAsync(int id)
        {
            return await Context.Set<T>().FirstOrDefaultAsync(x => x.Id == id);
        }

        public T GetSingle(Expression<Func<T, bool>> predicate)
        {
            return Context.Set<T>().FirstOrDefault(predicate);
        }

        public async Task<T> GetSingleAsync(Expression<Func<T, bool>> predicate)
        {
            return await Context.Set<T>().FirstOrDefaultAsync(predicate);
        }

        public T GetSingle(Expression<Func<T, bool>> predicate, params Expression<Func<T, object>>[] includeProperties)
        {
            IQueryable<T> query = Context.Set<T>();
            foreach (var includeProperty in includeProperties)
            {
                query = query.Include(includeProperty);
            }
            return query.Where(predicate).FirstOrDefault();
        }

        public async Task<T> GetSingleAsync(Expression<Func<T, bool>> predicate, params Expression<Func<T, object>>[] includeProperties)
        {
            IQueryable<T> query = Context.Set<T>();
            foreach (var includeProperty in includeProperties)
            {
                query = query.Include(includeProperty);
            }

            return await query.Where(predicate).FirstOrDefaultAsync();
        }

        public virtual IQueryable<T> FindBy(Expression<Func<T, bool>> predicate)
        {
            return Context.Set<T>().Where(predicate);
        }

        public virtual void Add(T entity)
        {
            Context.Set<T>().Add(entity);
        }

        public virtual void Update(T entity)
        {
            EntityEntry<T> dbEntityEntry = Context.Entry(entity);
            dbEntityEntry.State = EntityState.Modified;

            dbEntityEntry.Property(x => x.Id).IsModified = false;
            dbEntityEntry.Property(x => x.CreateUser).IsModified = false;
            dbEntityEntry.Property(x => x.CreateTime).IsModified = false;
        }

        public virtual void Delete(T entity)
        {
            Context.Set<T>().Remove(entity);
        }

        public virtual void AddRange(IEnumerable<T> entities)
        {
            Context.Set<T>().AddRange(entities);
        }

        public virtual void DeleteRange(IEnumerable<T> entities)
        {
            foreach (var entity in entities)
            {
                Context.Set<T>().Remove(entity);
            }
        }

        public virtual void DeleteWhere(Expression<Func<T, bool>> predicate)
        {
            IEnumerable<T> entities = Context.Set<T>().Where(predicate);

            foreach (var entity in entities)
            {
                Context.Entry<T>(entity).State = EntityState.Deleted;
            }
        }
        public void Attach(T entity)
        {
            Context.Set<T>().Attach(entity);
        }

        public void AttachRange(IEnumerable<T> entities)
        {
            foreach (var entity in entities)
            {
                Attach(entity);
            }
        }

        public void Detach(T entity)
        {
            Context.Entry<T>(entity).State = EntityState.Detached;
        }

        public void DetachRange(IEnumerable<T> entities)
        {
            foreach (var entity in entities)
            {
                Detach(entity);
            }
        }

        public void AttachAsModified(T entity)
        {
            Attach(entity);
            Update(entity);
        }
        
    }
}

建立Client的ViewModels

在CoreApi.ViewModels建立Angular資料夾, 分別針對查詢, 新增, 修改建立3個ViewModel(Dto):

ClientViewModel:

namespace CoreApi.ViewModels.Angular
{
    public class ClientViewModel : EntityBase
    {
        public decimal Balance { get; set; }
        public string Email { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Phone { get; set; }
    }
}

ClientCreationViewModel:

namespace CoreApi.ViewModels.Angular
{
    public class ClientCreationViewModel
    {
        public decimal Balance { get; set; }
        
        [Required]
        [MaxLength(100)]
        public string Email { get; set; }
        
        [Required]
        [MaxLength(50)]
        public string FirstName { get; set; }
        
        [Required]
        [MaxLength(50)]
        public string LastName { get; set; }

        [Required]
        [MaxLength(50)]
        public string Phone { get; set; }
    }
}

ClientModificationViewModel:

namespace CoreApi.ViewModels.Angular
{
    public class ClientModificationViewModel
    {
        public decimal Balance { get; set; }

        [Required]
        [MaxLength(100)]
        public string Email { get; set; }

        [Required]
        [MaxLength(50)]
        public string FirstName { get; set; }

        [Required]
        [MaxLength(50)]
        public string LastName { get; set; }

        [Required]
        [MaxLength(50)]
        public string Phone { get; set; }
    }
}

配置AutoMapper

針對Client和它的Viewmodels, 分別從兩個方向進行配置:

DomainToViewModelMappingProfile:

namespace CoreApi.Web.MyConfigurations
{
    public class DomainToViewModelMappingProfile : Profile
    {
        public override string ProfileName => "DomainToViewModelMappings";

        public DomainToViewModelMappingProfile()
        {
            CreateMap<UploadedFile, UploadedFileViewModel>();
            CreateMap<Client, ClientViewModel>();
            CreateMap<Client, ClientModificationViewModel>();
        }
    }
}

ViewModelToDomainMappingProfile:

namespace CoreApi.Web.MyConfigurations
{
    public class ViewModelToDomainMappingProfile : Profile
    {
        public override string ProfileName => "ViewModelToDomainMappings";

        public ViewModelToDomainMappingProfile()
        {
            CreateMap<UploadedFileViewModel, UploadedFile>();
            CreateMap<ClientViewModel, Client>();
            CreateMap<ClientCreationViewModel, Client>();
            CreateMap<ClientModificationViewModel, Client>();
        }
    }
}

註冊Repository的DI:

在web專案的StartUp.cs的ConfigureServices裡面為ClientRepository註冊DI:

services.AddScoped<IClientRepository, ClientRepository>();

建立Controller

在controllers目錄建立Angular/ClientController.cs:

namespace CoreApi.Web.Controllers.Angular
{
    [Route("api/[controller]")]
    public class ClientController : BaseController<ClientController>
    {
        private readonly IClientRepository _clientRepository;
        public ClientController(ICoreService<ClientController> coreService,
            IClientRepository clientRepository) : base(coreService)
        {
            _clientRepository = clientRepository;
        }

        [HttpGet]
        public async Task<IActionResult> GetAll()
        {
            var items = await _clientRepository.All.ToListAsync();
            var results = Mapper.Map<IEnumerable<ClientViewModel>>(items);
            return Ok(results);
        }

        [HttpGet]
        [Route("{id}", Name = "GetClient")]
        public async Task<IActionResult> Get(int id)
        {
            var item = await _clientRepository.GetSingleAsync(id);
            if (item == null)
            {
                return NotFound();
            }
            var result = Mapper.Map<ClientViewModel>(item);
            return Ok(result);
        }

        [HttpPost]
        public async Task<IActionResult> Post([FromBody] ClientCreationViewModel clientVm)
        {
            if (clientVm == null)
            {
                return BadRequest();
            }

            if (!ModelState.IsValid)
            {
                return BadRequest(ModelState);
            }

            var newItem = Mapper.Map<Client>(clientVm);
            newItem.SetCreation(UserName);
            _clientRepository.Add(newItem);
            if (!await UnitOfWork.SaveAsync())
            {
                return StatusCode(500, "儲存客戶時出錯");
            }

            var vm = Mapper.Map<ClientViewModel>(newItem);

            return CreatedAtRoute("GetClient", new { id = vm.Id }, vm);
        }

        [HttpPut("{id}")]
        public async Task<IActionResult> Put(int id, [FromBody] ClientModificationViewModel clientVm)
        {
            if (clientVm == null)
            {
                return BadRequest();
            }

            if (!ModelState.IsValid)
            {
                return BadRequest(ModelState);
            }
            var dbItem = await _clientRepository.GetSingleAsync(id);
            if (dbItem == null)
            {
                return NotFound();
            }
            Mapper.Map(clientVm, dbItem);
            dbItem.SetModification(UserName);
            _clientRepository.Update(dbItem);
            if (!await UnitOfWork.SaveAsync())
            {
                return StatusCode(500, "儲存客戶時出錯");
            }

            return NoContent();
        }

        [HttpPatch("{id}")]
        public async Task<IActionResult> Patch(int id, [FromBody] JsonPatchDocument<ClientModificationViewModel> patchDoc)
        {
            if (patchDoc == null)
            {
                return BadRequest();
            }
            var dbItem = await _clientRepository.GetSingleAsync(id);
            if (dbItem == null)
            {
                return NotFound();
            }
            var toPatchVm = Mapper.Map<ClientModificationViewModel>(dbItem);
            patchDoc.ApplyTo(toPatchVm, ModelState);

            TryValidateModel(toPatchVm);
            if (!ModelState.IsValid)
            {
                return BadRequest(ModelState);
            }

            Mapper.Map(toPatchVm, dbItem);

            if (!await UnitOfWork.SaveAsync())
            {
                return StatusCode(500, "更新的時候出錯");
            }

            return NoContent();
        }

        [HttpDelete("{id}")]
        public async Task<IActionResult> Delete(int id)
        {
            var model = await _clientRepository.GetSingleAsync(id);
            if (model == null)
            {
                return NotFound();
            }
            _clientRepository.Delete(model);
            if (!await UnitOfWork.SaveAsync())
            {
                return StatusCode(500, "刪除的時候出錯");
            }
            return NoContent();
        }
    }
}

首先, Controller繼承了ControllerBase這個類, ControllerBase是自己寫的類, 裡面可以放置一些公用的方法或屬性, 目前裡面的東西都沒用:

namespace CoreApi.Web.Controllers.Bases
{
    public abstract class BaseController<T> : Controller
    {
        protected readonly IUnitOfWork UnitOfWork;
        protected readonly ILogger<T> Logger;
        protected readonly IFileProvider FileProvider;
        protected readonly ICoreService<T> CoreService;

        protected BaseController(ICoreService<T> coreService)
        {
            CoreService = coreService;
            UnitOfWork = coreService.UnitOfWork;
            Logger = coreService.Logger;
            FileProvider = coreService.FileProvider;
        }

        #region Current Information

        protected DateTime Now => DateTime.Now;
        protected string UserName => User.Identity.Name ?? "Anonymous";

        #endregion

    }
}

由於父類建構函式依賴的類太多了, 所以我建立了一個CoreService, 裡面包含著這些依賴, 然後用一個變數就注入進去了, 這種寫法不一定正確:

public interface ICoreService<out T> : IDisposable
    {
        IUnitOfWork UnitOfWork { get; }
        ILogger<T> Logger { get; }
        IFileProvider FileProvider { get; }
    }

Controller裡面的方法應該都能看明白吧. 需要提一下的是UnitOfWork.

Unit Of Work

我才用的是UnitOfWork和Repository模式, 多個Repository掛起的資料庫操作, 可以使用一個UnitOfWork一次性提交.

由於DBContext已經實現了UnitOfWork模式, 所以可以直接在Controller裡面使用DbContext, 但是我還是做了一個介面 IUnitOfWork:

namespace CoreApi.DataContext.Infrastructure
{
    public interface IUnitOfWork: IDisposable
    {
        int SaveChanges();
        int SaveChanges(bool acceptAllChangesOnSuccess);
        Task<int> SaveChangesAsync(bool acceptAllChangesOnSuccess, CancellationToken cancellationToken = default(CancellationToken));
        Task<int> SaveChangesAsync(CancellationToken cancellationToken = default(CancellationToken));

        bool Save();
        bool Save(bool acceptAllChangesOnSuccess);
        Task<bool> SaveAsync(bool acceptAllChangesOnSuccess, CancellationToken cancellationToken = default(CancellationToken));
        Task<bool> SaveAsync(CancellationToken cancellationToken = default(CancellationToken));
    }
}

裡面前4個方法就是DbContext內建的方法, 後面4個方法可有可無, 就是上面4個方法的簡單變形.

看一下CoreContext:

namespace CoreApi.DataContext.Core
{
    public class CoreContext : DbContext, IUnitOfWork
    {
        public CoreContext(DbContextOptions<CoreContext> options)
            : base(options)
        {
        }

        protected override void OnModelCreating(ModelBuilder modelBuilder)
        {
            base.OnModelCreating(modelBuilder);
            modelBuilder.HasDefaultSchema(AppSettings.DefaultSchema);

            modelBuilder.ApplyConfiguration(new UploadedFileConfiguration());
            modelBuilder.ApplyConfiguration(new ClientConfiguration());
        }

        public DbSet<UploadedFile> UploadedFiles { get; set; }
        public DbSet<Client> Clients { get; set; }

        public bool Save()
        {
            return SaveChanges() >= 0;
        }

        public bool Save(bool acceptAllChangesOnSuccess)
        {
            return SaveChanges(acceptAllChangesOnSuccess) >= 0;
        }

        public async Task<bool> SaveAsync(bool acceptAllChangesOnSuccess, CancellationToken cancellationToken = default(CancellationToken))
        {
            return await SaveChangesAsync(acceptAllChangesOnSuccess, cancellationToken) >= 0;
        }

        public async Task<bool> SaveAsync(CancellationToken cancellationToken = default(CancellationToken))
        {
            return await SaveChangesAsync(cancellationToken) >= 0;
        }
    }
}

差不多了, 開始

遷移資料庫

在Package Manager Console分別執行 Add-Migration XXX和 Update-database命令.

注意這個時候解決方案的啟動專案必須是Web專案, 如果設定了多個啟動專案, 遷移命令會不太好用.

然後執行一下: 選擇CoreApi.Web而不是IISExpress, 這樣的話埠應該是 http://localhost:5001/api/values

到Swagger裡簡單測試下

然後進入swagger簡單測試一下ClientController: http://localhost:5001/swagger/

先新增資料 POST:

先點選右側, 然後會把資料的json模板複製到左邊的框裡, 然後修改值, 然後點選try It out, 結果如下:

然後兩個Get, Delete, Put您都應該會測試.

這裡試一下 Patch:

再查詢一下, 應該沒有什麼問題.

先寫到這, 明天就能差不多寫完了吧.

使用angular4和asp.net core 2 web api做個練習專案(三)
2017-11-02
AngularASP.NETWebAPI
使用angular4和asp.net core 2 web api做個練習專案(四)
2017-11-03
AngularASP.NETWebAPI
使用angular4和asp.net core 2 web api做個練習專案(二), 這部分都是angular
2017-11-01
AngularASP.NETWebAPI
使用 ASP.NET Core 和 MongoDB 建立 Web API
2024-06-06
ASP.NETMongoDBWebAPI
舊 WCF 專案成功遷移到 asp.net core web api
2020-08-16
ASP.NETWebAPI
ASP.NET Core Web Api之JWT(一)
2019-07-16
ASP.NETWebAPIJWT
ASP.NET Core Web API中使用Swagger
2019-07-04
ASP.NETWebAPISwagger
ASP.NET Core系列（二）：建立第一個.Net Core 專案
2019-07-19
ASP.NET
ASP.NET Core Web API 介面限流
2023-03-09
ASP.NETWebAPI
ASP.NET Core Web API 與 SSL
2018-06-20
ASP.NETWebAPI
練手專案，實現一個web框架
2016-11-14
Web框架
ASP.NET Core Web API 索引 (更新Redis in .NET Core)
2018-06-13
ASP.NETWebAPI索引Redis
【ASP.NET Core】體驗一下 Mini Web API
2021-11-16
ASP.NETWebAPI
ASP.NET Core 實戰：使用 ASP.NET Core Web API 和 Vue.js，搭建前後端分離框架
2018-12-20
ASP.NETWebAPIVue.js後端框架
用VSCode開發一個asp.net core2.0+angular5專案(5): Angular5+asp.net core 2.0 web api檔案上傳
2018-03-10
VSCodeASP.NETAngularWebAPI
ASP.NET Core Web API 整合測試
2018-07-22
ASP.NETWebAPI
開始使用ASP.NET Core - 建立第一個Web應用
2017-03-20
ASP.NETWeb
ASP.NET Core Web API + Identity Server 4 + Angular 6 實戰小專案視訊
2018-08-20
ASP.NETWebAPIIDEServerAngular
Asp.Net Web API 2第十課——使用OWIN自承載Web API
2013-12-05
ASP.NETWebAPI
【搬運】ASP.NET Core Web API Attributes
2017-09-20
ASP.NETWebAPI
ASP.NET Core 1.0開發Web API程式
2016-06-17
ASP.NETWebAPI
從頭編寫 asp.net core 2.0 web api 基礎框架 (2)
2017-10-09
ASP.NETWebAPI框架
ASP.NET Core Web API 整合測試中使用 Bearer Token
2018-07-23
ASP.NETWebAPI
Web API--入門--（一）ASP.NET Web API 2（C＃）入門
2017-05-17
WebAPIASP.NET
ASP.NET Web API與Rest web api(一)
2013-10-21
ASP.NETWebAPIREST
【ASP.NET Web API教程】2 建立各種Web API
2014-02-21
ASP.NETWebAPI
ASP.NET Core 入門教程 2、使用ASP.NET Core MVC框架構建Web應用
2018-09-21
ASP.NETMVC框架架構Web
java web和asp.net哪個做網站好
2015-04-22
JavaWebASP.NET網站
從0到1手把手教你ASP.NET Core Web API專案配置介面文件Swagger（一）
2023-04-11
ASP.NETWebAPISwagger
一個練習專案，好玩的bbs-1
2024-06-21
一個練習專案，好玩的bbs-java
2024-06-21
Java
一個練習專案，好玩的bbs-c#
2024-06-21
C#
.Net Core 3.1瀏覽器後端服務（一） Web API專案搭建
2021-02-03
瀏覽器後端WebAPI
ASP.NET Core Web API 流式返回，逐字顯示
2023-04-23
ASP.NETWebAPI
使用Beego構建一個web專案
2017-12-14
GoWeb
【WEB API專案實戰乾貨系列】- WEB API入門(一)
2015-10-11
WebAPI
使用ASP.NET Web API構建RESTful API
2017-11-01
ASP.NETWebAPIREST
ASP.NET Core 2.1 Web API + Identity Server 4 + Angular 6 + Angular Material 實戰小專案視訊
2018-08-18
ASP.NETWebAPIIDEServerAngular