小编SMH*_*SMH的帖子

interface Items {
    id: Item,
}

id不是可选的,但它将具有不同的名称

例如:

let items = {
34433ded : {name: "foo", price: 0.99},
14d433dee : {name: "bar", price: 1.99},
}

我正在尝试找出在Angular 6中获取当前路线参数的最佳方法是什么。

此刻，我必须将传递ActivatedRoute给服务的方法作为参数，然后在服务中使用它。

export class MainComponent {
    constructor(private dataService: DataService, private activeRoute: ActivatedRoute) { }

    getChartsData() {
        return this.dataService(this.activeRoute);
    }
}

@Injectable({
  providedIn: "root"
})
export class DataService {
    getChartsData(activatedRoute) {
        if (activatedRoute.snapshot.params['id']) {
            ...
        } else {
            ...
        }
    }
}

我有一个包含三个组件的页面：1.产品列表组件，该组件获取一些产品作为输入并显示它们。2.过滤器组件，它显示一些过滤器列表，例如（尺寸，颜色，...），并显示添加的过滤器。3.主要成分是根成分

假设某个用户添加了一个过滤器，该过滤器会触发一个http请求以获取新的过滤产品，而在请求未决时，他删除添加的过滤器，该过滤器将触发另一个http请求以获取所有产品如何取消第一个请求，因此我们不显示过滤后的产品？这是我的代码：

class FiltersService {
  private _filters: any[];

  get filters() {
    return this._filters;
  }
  addFilter(filter) {
    this._filters.push(filter);
  }

  removeFilter(filter) {
    // Remove filter logic ...
  }

}

class DataService_ {
  constructor(private http: HttpClient) {

  }

  getProducts(filters) {
    return this.http.post<any[]>('api/get-products', filters)
  }

}


@Component({
  selector: 'app-main',
  template: `
  <div>
      <app-filters [filtersChanged]="onFiltersChange()"></app-filters>
      <app-products-list [products]="products"> </app-products-list>
</div>
`
})
class MainComponent {
  products: any[];

  constructor(private dataService: DataService_, private filtersService: FiltersService) {

  }

  ngOnInit() {
    this.setProducts()
  }

  setProducts() {
    let filters = this.filtersService.filters;
    this.dataService.getProducts(filters) …