Angular 无法清除Observable subscribe方法中的数组组件变量

Angular 无法清除Observable subscribe方法中的数组组件变量,angular,observable,Angular,Observable,这是我的密码: export class MyComponent implements OnInit { dataB: any[] = []; ngOnInit() { this._myService.DataSource$.subscribe(dataA => { this.dataB = []; console.log('length of dataB (before): ' + this.dataB.length); d

这是我的密码:

export class MyComponent implements OnInit {
   dataB: any[] = [];
   ngOnInit() {
     this._myService.DataSource$.subscribe(dataA => {
       this.dataB = [];
       console.log('length of dataB (before): ' + this.dataB.length);
       dataA.forEach(da => {
         var newData = {
           id: 0,
           name: da.name,
           verifyMethod: '',
           notes: ''
         };
         this.dataB.push(newData);
       }
       console.log('length of dataB (after): ' + this.dataB.length);
     });
   }
}
\u myService.DataSources$
是在应用程序的其他地方订阅的,因此在这个组件中,它总是通过
subscribe
方法运行两次,奇怪的是
这个.dataB一直在增长,即使我在
subscribe
方法的最顶端将它重置为空数组(注意:每次只有8个dataA项),两个
控制台。日志打印输出如下:

length of dataB (before): 0
length of dataB (after): 8
length of dataB (before): 0
length of dataB (after): 16

我的目标是在每次有新的
dataA
可用时重新创建
dataB
数组,但它似乎会随着应用程序中的多个并发
\u myService.DataSource$
订阅调用不断生成重复项!我如何可靠地在subscribe方法中每次重置
此.dataB

您需要取消订阅observable,以防止加载更多数据和内存泄漏

最简单的方法是使用ngrx操作符,你的最终代码看起来像是什么

ngOnInit() {
 this._myService.DataSource$
 .pipe(take(1)) // <==== note this part it will take only one value and unsubscribe then
 .subscribe(dataA => {
   this.dataB = [];
   console.log('length of dataB (before): ' + this.dataB.length);
   dataA.forEach(da => {
     var newData = {
       id: 0,
       name: da.name,
       verifyMethod: '',
       notes: ''
     };
     this.dataB.push(newData);
   }
   console.log('length of dataB (after): ' + this.dataB.length);
 });
}
ngOnInit(){
这是.\u myService.DataSource$
.管道(取(1))//{
this.dataB=[];
log('数据长度(之前):'+此.dataB.length);
dataA.forEach(da=>{
var newData={
id:0,
姓名:da.name,
验证方法:“”,
注释:“”
};
this.dataB.push(newData);
}
log('dataB的长度(之后):'+this.dataB.length);
});
}

希望这能解决您的问题。

我认为您的数据A的长度第二次是16,请仔细检查。您也可以使用数组的map函数代替forEach+push方法,以使代码更清晰。@udalmik否,它是8,我每次都会逐步检查代码,传入的数据A总是8项,实际上,我也会查看16项数组,它是包含同一组文件的两个副本items@ForComment请首先在函数:
console.log('dataA的长度(之前):'+this.dataA.length)上添加此项
。因为我也认为你的
数据a
在增加。好吧,我在上面的代码片段中简化了数据a,它实际上正在另一个进程中处理,在那里,它确实没有被重置为空。我花了3个小时盯着这个,我觉得很愚蠢。谢谢大家。卡姆兰,这是一个很好的建议,我总是有点傻不清楚,所以如果使用
获取(1).订阅
,它只是一次获取数据还是仍然是连续的?我的意思是当新数据可用时,它将被触发再次获取,对吗?不,它不会。获取(1)确保订户只接收一个数据,然后取消订阅。即使源发出新的值,也不会接收更多的值。@对于评论,它将只接收一个值,然后取消订阅。您可以在我的回答中的
take
链接中阅读更多详细信息。