Question

我有一个将Promise作为输入的组件：

export class Component  {
    @Input() appendingFunction: Promise<PagedData<any>>
}

“ appendingFunction”可能看起来像这样：

async foo(importantParameter, parameter1,..parameter n): Promise<PagedData<City>>

现在在解决appendingFunction之前，我要设置importantParameter。我知道它会存在，但是我不知道如何定义它。我不在乎其他任何可能存在的参数。

我该怎么做？

完整结构：

外部组件1：

export class OutsideComponent1{
   async foo(importantParameter, x):Promise<PagedData<boolean>>{
   ...
   }
}

外部组件2：

export class OutsideComponent2{
   async foo(importantParameter, x, y, z):Promise<PagedData<number>>{
   ...
   }
}

两者都使用HTML：

<inner-component [appendingFunction]="foo()"></inner-component>

内部组件：

export class InnerComponent  {
    @Input() appendingFunction: Promise<PagedData<any>>

onClick(){
  //thats what i would need
  appendingFunction.setImportantParameter();
   appendingFunction.then(() => doSomething)

}

Answer 1

我建议对您的解决方案有所不同。

您可以如下创建服务AppendingBridgeService：

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable({
  providedIn: 'root'
})
export class AppendingBridgeService {
  private _importantParam = new Subject<any>();
  importantParam$ = this._importantParam.asObservable();

  constructor() {}

  public next(nextParam: string) {
    this._importantParam.next(nextParam);
  }
}

然后，在您的Outside组件中，将此服务声明为依赖项：

export class OutsideComponent1{
  constructor(abs: AppendingBridgeService) {
    this.abs.importantParam$.subscribe(nextParam => {
      this.foo(nextParam, x).then(pagedData => {
        doSomething;
      });
    });
  } 
}

然后，将内部组件这样绑定到相同的桥服务：

export class InnerComponent  {
    constructor(abs: AppendingBridgeService) { }

    onClick(){
        this.abs.next(importantParameter);
    }
}

最后，如果您想将内部组件与Outside组件中的promise的结果联系在一起，则可以创建另一种桥接服务，该桥接服务采用相反的方式并采用另一种类型，在您的情况下，{ {1}}。

在组件中编辑动态承诺

1 个答案: