从 HTML 调用函数到打字稿没有等待完成

如何解决从 HTML 调用函数到打字稿没有等待完成

我有一个如下的 HTML 元素

<div *ngFor="let item of items">
    <input type='number' [min]="getMinData(param1,param2)" />
</div>

ts 文件内

 getMinData(rules: ConstraintRule[],id: string) {
    rules.forEach((rule) => {
      rule._Metadata.productList.forEach((product: SProduct) => {
        product.OptionGroups.forEach((optionGroup: SProductOptionGroup) => {
          optionGroup.Options.forEach((option: SProductOptionComponent) => {
            if (option.ComponentProductId == id) {
              return option.MinQuantity;
            }
          });
        });
      });
    });
  }

此外，没有任何 API 调用或任何其他事情，它只是对本地数据进行过滤。

但是，在 HTML 上不会返回正确的数量。

解决方法

你必须为 getMinData 函数返回一些东西。

当前，您调用 return option.MinQuantity;，但它是匿名函数的结果 - (option: SProductOptionComponent) => {。

如果你只想找到第一个 option.MinQuantity，试试这个函数：

getMinData(rules: ConstraintRule[],id: string) {
  let minQuantity = 0;

  rules.forEach((rule) => {
    rule._metadata.productList.forEach(({ OptionGroups }) => {
      OptionGroups.forEach(({ Options }) => {
        const foundOption = Options.find((o) => o.ComponentProductId === id);
        minQuantity = foundOption ? foundOption.MinQuantity : 0; // Default min value is 0
      });
    });
  });

  return minQuantity; // return value
}