如何按字符串发送和过滤数据

让我们从服务器端的操作开始。

[HttpPost]
// обычно пишут так, чтобы в строке можно было передать [HttpPost({id})]
// и еще для получения данных рекомендуется использовать метод GET
public async Task<ActionResult> GetVendorClothes(string data)
{
    // здесь ен вижу смысла с асинхронности, но да ладно
    var find = (from dadsa in _context.Clothes.Where(p => p.VendorCode == data)
            select dadsa
        ).ToListAsync();
    // почему бы не использовать FirstOrDefault вместо Where... вам же нужно одну запись найти
    vendor = await find;
    // ну и последняя проблемаю...Вы данные отобрали, но не возвратили их
    return Ok();
}

重写并获取

[HttpGet("{id}")]
public async Task<ActionResult> GetVendorClothes(string id)
{
    var finder = _context.Clothes.FirstOrDefault(f => f.VendorCode == id);
    return new JsonResult(finder);
}

现在我们可以通过请求 http://localgost:1111/api/{controller}/getVendorClosest/{id} 获取对象

仍然需要为这个请求重新制作 Angular 服务（也许路由需要受 id 影响），所以你应该赚取加减。给女士们的唯一建议是将数据存储在服务中，然后在 html 中通过 async 管道获取...如果您不知道该怎么做，请写，我会补充答案

更新

让我们继续讨论客户端。

我们将创建模型，我们将在后面和前面工作

// интерфейс для данных с бэка
export interface BClothes {
   ClothesId: number;
   VendorCode: string;
   Name: string;
   Image: string;
   Amount: number;
   Price: number;
}

// класс для фронта. Класс для того, чтобы задавать конструктор для меньшего количества кода
export class FClothes {
   clothesId: number;
   vendorCode: string;
   name: string;
   image: string;
   amount: number;
   price: number;
}

服务（需要实现业务逻辑）

@Injectable()
export class ClothesService {
   // тут храню полученные данные, теперь чтобы получить данные в любом компоненте, нужно всего лишь забрать этот сервис
   clothes: BehaviorSubject<Array<FClothes>> = new BehaviorSubject<Array<FClothes>>([]);
   constructor(private httpClient: HttpClient){}
   
   // этот метод получает весь список, в аргументе обычно пихают пэйджинг или фильтра
   getClothesList(): void {
     this.httpClient
        .get<Array<BClothes>>("link")
        .pipe(
           // забочусь об отписании подписки после выполнения запроса
           take(1)
        )
        .subscribe((res: Array<BClothes>) => {
           // записываю результат
           this.clothes.next(res.map(m => ({
               clothesId: m.ClothesId;
               vendorCode: m.VendorCode;
               name: m.Name;
               image: m.Image;
               amount: m.Amount;
               price: m.Price;
           })));
         });
   }

   // теперь получается что у меня есть все данные, и они хранятся в известой мне переменной, и при желании я могу их использовать. 
   // Обычно дополнительный метод по получению инфы по id или еще чему-то делается для следующего: 
   // 1. В общей таблицы зачастую не за чем светить много информации дабы не перегружать UX 
   // 2. Ну и скорось работы тоже никто не отменял. 
   // Поэтому, когда гружу общий список, то гружу не все поля по каждому объекту, а часть. 
   // И потом, когда проваливаюсь в конкретный объект, то уже дополучаю все данные.
   getClothesById(id: string): Observable<FClothes>{
      return this.gttpClient
         .get<BClothes>(`link/${id}`)
         .pipe(
            map((m: BClothes) => ({
               clothesId: m.ClothesId;
               vendorCode: m.VendorCode;
               name: m.Name;
               image: m.Image;
               amount: m.Amount;
               price: m.Price;
            })),
            take(1)
         )
   }
}

好吧，那么显示的那一刻......我们的组件（页面本身）

@Component({
   ...
   providers: [ClothesService]
})
export class ClothesComponent implements OnInit {
   clothes: Observable<Array<FClothes>>;
   constructor(private clothesService: ClothesService){
      this.clothes = this.clothesService.clothes;
   }

   ngOnInit(): void {
      this.clothesService.getClothesList();
   }

   showDetails(selected: FClothes): void {
      // открыть компонент (к примеру модалку)
      // и в ней сделать запрос на получение по id
   }
}

好了，现在html

<div class="clothes_container">
   <table>
      <thead>
         <tr>
            <th>Названи</th>
            <th>Кол-во</th>
            <th>Цена</th>
            <th></th>
         </tr>
      </thead>
      <tbody>
         <tr *ngFor="let cl of clothes | async">
            <th>{{cl.name}}</th>
            <th>{{cl.amount}}</th>
            <th>{{cl.price}}</th>
            <th>
               <button (click)="showDetails(cl)">Подробнее</button>
            </th>
         </tr>
      </tbody>
   </table>
<div>