Question

我正在Angular上创建分类广告网站。

路线＆＃34;添加＆＃34;有两个组成部分：

1）对于类别（onInit - ＆gt;从数据库收到）;

2）对于子类别（在选定的类别之后 - >从数据库中收到的子类别列表）;

并分开路由器插座。

在路由器插座中，我收到了选定的子类别＆＃34; id＆＃34;，但我无法理解如何为所选的sudcategory包含所有字段所需的组件。

也许我错了，还有另外一种方法可以解决这个问题吗？

这是我的代码：

路由的主要根组件＆＃34;添加＆＃34; addadvert.component.html

<app-adcat [categors]="categors" (selectCat)="selectCat($event)"></app-adcat>
<app-adsubcat [subcategors]="subcategors" (onSelect)="onSelect($event)"></app-adsubcat>
<router-outlet></router-outlet>

adcat.component.html

<div class="page-header">
  <h3>Select category</h3>
</div>
<ul class="list-group" *ngFor="let categor of categors">
  <li class="list-group-item" (click)="select(categor)" [class.selected]="categor === selected">{{ categor.cat_name }}</li>
</ul>

adsubcat.component.html

<div *ngIf="subcategors">
  <div class="page-header">
  <h3>Select subcategory</h3>
</div>
<ul class="list-group" *ngFor="let subcat of subcategors; let i = index">
  <li class="list-group-item" (click)="select(subcat)" [class.selected]="subcat === selected" >{{ subcat.subcat_name }}</li> 
</ul>
</div>

adsubcat.component.ts

select(subcat) {
  this.selected = subcat;
  this._router.navigate(["add/selected", subcat.id_subcat]);
}

路线添加/已选择/ ID

ngOnInit() {
  this._activatedRoute.params.forEach(params => {
  this.selectedSubCat = params;
 })
}

我有一个解决方案，但它并不是很优雅：

<div *ngIf="selectedSubCat.id === '1'">
  <app-rent></app-rent>
</div>

<div *ngIf="selectedSubCat.id === '2'">
  <app-sell></app-sell>
</div>

Angular - 如何向webform添加新组件（具有单独的字段）

0 个答案: