How fill Drop down list in angular 9 with api Asp.net pi

 CREATE TABLE [dbo].[tblSkills](  
      [SkillID] [int] IDENTITY(1,1) NOT FOR REPLICATION NOT NULL,  
      [Title] [varchar](50) NULL,  
      [isacrtive] [bit] NULL,  
 PRIMARY KEY CLUSTERED   
 (  
      [SkillID] ASC  
 )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]  
 ) ON [PRIMARY]  
 GO  
 SET ANSI_PADDING OFF  
 GO  
 SET IDENTITY_INSERT [dbo].[tblSkills] ON   
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (1, N'Visual Foxpro', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (2, N'C#', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (3, N'VB.NET', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (4, N'Delphi', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (5, N'Java', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (6, N'Power Builder', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (7, N'COBOL', NULL)  
 INSERT [dbo].[tblSkills] ([SkillID], [Title], [isacrtive]) VALUES (8, N'Python', NULL)  
 SET IDENTITY_INSERT [dbo].[tblSkills] OFF  
 

Scaffold-DbContext "Server=.;Database=MbkTest;Trusted_Connection=True;" Microsoft.EntityFrameworkCore.SqlServer -OutputDir Models -Tables tblSkills -Force

TblSkillsController.cs

 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Threading.Tasks;  
 using Microsoft.AspNetCore.Http;  
 using Microsoft.AspNetCore.Mvc;  
 using Microsoft.EntityFrameworkCore;  
 using CurdAPP2.Models;  
 namespace CurdAPP2.Controllers  
 {  
   [Route("api/[controller]")]  
   [ApiController]  
   public class TblSkillsController : ControllerBase  
   {  
     private readonly MbkTestContext _context;  
     public TblSkillsController(MbkTestContext context)  
     {  
       _context = context;  
     }  
     // GET: api/TblSkills  
     [HttpGet]  
     public async Task<ActionResult<IEnumerable<TblSkills>>> GetTblSkills()  
     {  
       return await _context.TblSkills.ToListAsync();  
     }  
     // GET: api/TblSkills/5  
     [HttpGet("{id}")]  
     public async Task<ActionResult<TblSkills>> GetTblSkills(int id)  
     {  
       var tblSkills = await _context.TblSkills.FindAsync(id);  
       if (tblSkills == null)  
       {  
         return NotFound();  
       }  
       return tblSkills;  
     }  
     // PUT: api/TblSkills/5  
     [HttpPut("{id}")]  
     public async Task<IActionResult> PutTblSkills(int id, TblSkills tblSkills)  
     {  
       if (id != tblSkills.SkillId)  
       {  
         return BadRequest();  
       }  
       _context.Entry(tblSkills).State = EntityState.Modified;  
       try  
       {  
         await _context.SaveChangesAsync();  
       }  
       catch (DbUpdateConcurrencyException)  
       {  
         if (!TblSkillsExists(id))  
         {  
           return NotFound();  
         }  
         else  
         {  
           throw;  
         }  
       }  
       return NoContent();  
     }  
     // POST: api/TblSkills  
     [HttpPost]  
     public async Task<ActionResult<TblSkills>> PostTblSkills(TblSkills tblSkills)  
     {  
       _context.TblSkills.Add(tblSkills);  
       await _context.SaveChangesAsync();  
       return CreatedAtAction("GetTblSkills", new { id = tblSkills.SkillId }, tblSkills);  
     }  
     // DELETE: api/TblSkills/5  
     [HttpDelete("{id}")]  
     public async Task<ActionResult<TblSkills>> DeleteTblSkills(int id)  
     {  
       var tblSkills = await _context.TblSkills.FindAsync(id);  
       if (tblSkills == null)  
       {  
         return NotFound();  
       }  
       _context.TblSkills.Remove(tblSkills);  
       await _context.SaveChangesAsync();  
       return tblSkills;  
     }  
     private bool TblSkillsExists(int id)  
     {  
       return _context.TblSkills.Any(e => e.SkillId == id);  
     }  
   }  
 }  

Angular
skillsM.ts

 export class skillsM {  
  skillId?: number;  
  title: string;  
  isacrtive?: number;  
 }  

blog-post.service.ts

  getskills(): Observable<skillsM[]> {  
   return this.http.get<skillsM[]>(this.myAppUrl + 'api/TblSkills/')  
   .pipe(  
    retry(1),  
    catchError(this.errorHandler)  
   );  
  }  

 public skillsMs: Observable<skillsM[]>;  
    
    this.skillsMs = this.blogPostService.getskills();  

    <select class="form-control" [formControl]="skillId">  
     <option value="0">--Select--</option>  
     <option *ngFor="let blogPost of (skillsMs | async)"  
         value={{blogPost.skillId}}>  
       {{blogPost.title}}  
     </option>  
 </select>