2017-02-17 21 views
0

私はチャットアプリケーションを構築していて、新しいmessageがリストに追加されると、messageリストを含むchatアイテムを更新する必要があります。Javascript可観測無限ループ

私はAngularFire2を使用しており、Observableを持っています。このObservableは、期待通りに動的にリストを動的に維持するために完全に機能します。

しかし、私は難解です。リストが変更されたら、updateを実行する必要があり、リストが変更され、の無限ループという結果になります。

コード:

次は、私はあなたが見ることができるように、私はchatItem

を更新し、この Observable

findAllMessages(chatItem: any): Promise<any> { 
    return this.firebaseDataService.findMessages(chatItem).forEach(firebaseItems => { 
     chatItem.lastMsg_text = 'updated value'; 
     this.firebaseDataService.updateChat(chatItem); 
    }); 
} 

でリストを作成するObservable

findMessages(chatItem: any): Observable<any[]> { 
    return this.af.database.list('/message/', { 
     query: { 
      orderByChild: 'negativtimestamp' 
     } 
    }).map(items => { 
     const filtered = items.filter(
      item => ((item.memberId1 === chatItem.memberId1 && item.memberId2 === chatItem.memberId2) 
       || (item.memberId1 === chatItem.memberId2 && item.memberId2 === chatItem.memberId1)) 
     ); 
     return filtered; 
    }); 
} 

ですここで0

updateChat(chatItem: any): firebase.Promise<void> { 
    return this.findChat(chatItem).forEach((chatItems: any[]) => { 
     if (chatItems.length > 0) { 
      for (let i: number = 0; i < chatItems.length; i++) { 
       return this.af.database.object('/chat/' + chatItems[i].$key).update({ 
        timestamp: chatItem.timestamp, 
        negativtimestamp: chatItem.negativtimestamp, 
        lastMsg_text: chatItem.lastMsg_text, 
        lastMsg_read1: chatItem.lastMsg_read1, 
        lastMsg_read2: chatItem.lastMsg_read2 
       }); 
      } 
     } else { 
      this.createChatFromItem(chatItem); 
     } 
    }); 
} 

質問

私の混乱、私はchatsなくmessagesを更新していますので、なぜmessagesObservableがトリガされていることがありますか?無限ループを避けるためにこれを達成する方法はありますか?

助けてください。

答えて

1

あなたはこれをもっと簡単なやり方で扱うことができるようです...約束した方法約束& Observablesはちょっと複雑です。

Subjectを調べましたか?

非常に簡単に言えば、あなたのアプリケーションのいずれかの部分からその件名に加入し、その時から

yourSubject.next(newChatMessage) 

を呼び出すことによって、あなたのチャットアプリケーションの変更件名「出版」を持っている可能性は、あなたが」必要な更新を行うことができます。あなたは状態管理の対象に深く掘るしたい場合

その後、次を見て可能性:

RxJS powered state management for Angular applications, inspired by Redux

関連する問題