javascript - Angular，如何跟踪地图（） 修改？

Question

我正在使用 Angular 9，我想跟踪我的 Map<string, any>() 何时被修改。

上下文：
我想在垂直滚动列表中使用角度 cdk 滚动显示我的 Map 的值。
因此，由于 cdkVirtualFor数据类型限制，我需要创建一个简单的数组来显示我的地图数据。
所以我用 Array.from(myMap.values()); 创建了它

let myMap = new Map<string, any>(); // My main Map
let myArrayToMyScrollingList = Array.from(myMap.values()); // My array to display feed by My main Map values

所以在我的 HTML 组件文件中，我有：

<cdk-virtual-scroll-viewport [itemSize]="itemSize" [minBufferPx]="itemLength" [maxBufferPx]="itemLength">
     <div *cdkVirtualFor="let item of myArrayToMyScrollingList">
          {{ item  }}
     </div>
</cdk-virtual-scroll-viewport>

所以它的作品。
但是，当 myMap 更新时， myArrayToMyScrollingList 不会应用更改。

如何检测 Map<string, any>() 值修改以告诉 myArrayToMyScrollingList 他必须更新他的值？

我测试了什么：

• changeDetection：ChangeDetectionStrategy.OnPush 或 ChangeDetectionStrategy.Default 与 @Input() 通过传递 myMap 作为参数。但是当 myMap 有值修改时没有发现变化检测。

感谢您的帮助，问候

标签： javascriptangulartypescript

Answer 1

一个简单的解决方案可能是

get myArrayToMyScrollingList() {
  return Array.from(myMap.values());
}

在组件类中。