Angular - не может связать свойство, так как оно не является известным свойством div - PullRequest
Новая
       27

Angular - не может связать свойство, так как оно не является известным свойством div

0 голосов
/ 21 июня 2019

У меня есть список объектов, и, щелкнув по одному из них, мне нужно открыть модальное окно и показать некоторые свойства этого объекта.

Мой код выглядит так:

Компонент объекта: 

export class VendorComponent implements OnInit {
  @Input() currentVendor: Vendor;
  vendors: Vendor[];

  constructor(public actRoute: ActivatedRoute,
              public router: Router,
              private vendorService: VendorService,
              private modalHandlerService: ModalHandlerService) { }

  ngOnInit() {
    this.GetAll();
  }

  GetAll() {
    this.vendorService.getVendors().subscribe((data: Vendor[]) => {
      this.vendors = data;
    });
  }

  openVendorDetailsModal() {
    this.modalHandlerService.openVendorDetailsModal(this.currentVendor);
  }
}

При нажатии на openVendorDetailsModal мне нужно открыть модал с деталями, мой взгляд выглядит так: 

<table>
  <tr>
    <th>Id</th>
    <th>Name</th>
  </tr>
  <div *ngFor="let vendor of vendors" [currentVendor]= "vendor" (click)="openVendorDetailsModal(vendor)">
      <tr>
    <td>{{vendor.Id}}</td>
    <td>{{vendor.Name}}</td>
  </tr>
  </div>
</table>

Проблема в том, что синтаксис [currentVendor]= "vendor" в представлении возвращает ошибку, упомянутую в заголовке. Как связать текущего поставщика с компонентом, чтобы я мог отправить его в качестве параметра метода?

Ответы [ 2 ]

1 голос
/ 21 июня 2019

Что я имею в виду, чтобы сделать это: 

openVendorDetailsModal(vendor) {
   this.modalHandlerService.openVendorDetailsModal(vendor);
}

В шаблоне удалите [currentVendor] и продолжайте передавать vendo на openVendorDetailsModal. Надеюсь, это поможет.

1 голос
/ 21 июня 2019

просто передайте поставщика методом openVendorDetailsModal 

  <div *ngFor="let vendor of vendors" (click)="openVendorDetailsModal(vendor)">
      <tr>
    <td>{{vendor.Id}}</td>
    <td>{{vendor.Name}}</td>
  </tr>
  </div>

и вы можете использовать параметр Vender 

  openVendorDetailsModal(vender) {
    this.modalHandlerService.openVendorDetailsModal(vender);
  }

если вы хотите сохранить ссылку на переданный верндер, установите curentVender в теле метода 

  openVendorDetailsModal(v) {
    this.currentVendor = v;
    this.modalHandlerService.openVendorDetailsModal(v);
  }
...