Не выводится текст в angular с webAPI

[dimaSlon]

Мне нужно показать все имена, которые я записал в таблице Базы данных в поле Angular.

Моя БД:

 CREATE TABLE [dbo].[Sellers](
    [Id] [int] IDENTITY(1,1) PRIMARY KEY NOT NULL,
    [Login] [varchar](50) NOT NULL,
    [Password] [varchar](50) NOT NULL,
    [Name] [nchar](50) NOT NULL,
    [Address] [nchar](50) NOT NULL,
    [Email] [varchar](50) NOT NULL,
    [RegistrationDate] [datetime] NOT NULL,
)
GO

Я делаю в WebAPI чтобы все названия взяло с таблицы

 public class SellersController : ApiController
    {
        [HttpGet]
        public async Task<IHttpActionResult> GetNames(string name)
        {
            using (var dataBaseContext = new DataBaseContext())
            {
                var query = from seller in dataBaseContext.Sellers
                            where
                            seller.Name == name
                            select seller;
                return Ok(await query.ToListAsync());
            }
        }
    }

Теперь додаю в Ангуляре сервис:

 import { Sellers } from './sellers.model';
import { Injectable } from '@angular/core';

@Injectable({
   providedIn: 'root'
})
export class SellersService {
   formData : Sellers;
   seller : Sellers = new Sellers();
   constructor() { }
}

Додаю в app.module

import { SellersService } from './shared/sellers.service';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { TopRegionComponent } from './components/top-region/top-region.component';
import { LeftRegionComponent } from './components/left-region/left-region.component';
import { BottomRegionComponent } from './components/bottom-region/bottom-region.component';
import { CenterRegionComponent } from './components/center-region/center-region.component';
import { UserComponent } from './components/user/user.component';

const appRoutes: Routes = [
  {path: '', component: AppComponent},
  {path: 'user', component: UserComponent},
  {path: 'left-region', component: LeftRegionComponent},
  {path: 'top-region', component: TopRegionComponent},
  {path: 'bottom-region', component: BottomRegionComponent},
  {path: 'center-region', component: CenterRegionComponent},
]

@NgModule({
  declarations: [
    AppComponent,
    TopRegionComponent,
    LeftRegionComponent,
    BottomRegionComponent,
    CenterRegionComponent,
    UserComponent,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    RouterModule.forRoot(appRoutes),
    HttpModule,
    FormsModule
  ],
  providers: [SellersService],
  bootstrap: [AppComponent]
})
export class AppModule { }

Туда кудаа хочу додавать названия в компонент

 import { SellersService } from './../../shared/sellers.service';
import { Component, OnInit } from '@angular/core';


@Component({
  selector: 'left-region',
  templateUrl: './left-region.component.html',
  styleUrls: ['./left-region.component.css']
})
export class LeftRegionComponent implements OnInit {

  constructor(private service : SellersService)
   {
   }

  ngOnInit() {
  }

}

http

<div class="p-3 px-md-4 mb-3 bg-white">
  <input name="Sellers" #Sellers="ngModel" [(ngModel)]= "seller.Name" class="form-control">
  </div>

Выдает ошибку:

Can't bind to 'ngModel' since it isn't a known property of 'input'.Angular