角度，如何跟踪地图<字符串，任何>()修改？

Question

我正在使用Angular 9，我想跟踪我的Map<字符串，任意>((已修改。

上下文：
我想使用角度cdk滚动在垂直滚动列表中显示Map的值。
因此，cdkVirtual的原因对于数据类型限制，我需要创建一个简单的数组来显示我的Map数据。
所以我用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不会应用更改。

如何检测映射<字符串，任意>((修改值以告诉我的myArrayToMyScrollingList他必须更新他的值？

我测试的内容：

• 变更检测：变更检测策略。OnPush或ChangeDetectionStrategy。通过传递myMap作为参数，使用@Input((进行默认设置。但是，当myMap进行值修改时，没有发现任何更改检测

感谢您的帮助，问候

Answer 1

我有时会使用这样的东西(通用方式(：

TS

private myMap = new Map<number, YourTypeHere>();
private myValues$$ = new ReplaySubject<YourTypeHere[]>(1);
public myValues$ = this.myValues$$.asObservable()

public updateMap(key,value) {
this.myMap.set(key, value);
this.updateMyValues();
}
private updateMyValues() {
this.myValues.next(Array.from(this.myMap.values()));
}

HTML

<div *ngFor="let item of myValues$ async">
{{item.name}}
</div>

Answer 2

是一个简单的解决方案

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

在组件类中。