角4：別の変数に依存するコンポーネント変数

Question

申し訳ありませんので、私はajax呼び出しを行い、一連のメッセージのリストを受け取ります。メッセージは処理されるか完了し、変数isProcessedによってマークされます。ここで、0に等しい場合はそれはなく、1の場合にはメッセージが処理されます。

とにかく、私は受け取ったメッセージを 'messageArray'と呼ばれるコンポーネントの1つの変数に設定しています...そして、処理済みで完了した2つの別々の変数があります。これらの関数は、基本的にmessageArrayのフィルタと同じです。

しかし、私の質問は、なぜこれらの変数がmessageArray変数が変更されたときに変更されないのですか。これを回避するにはどうすればよいですか。これは見た目です。

messageArray: Array<any> = [] 

    processing = this.messageArray.filter((message) => { 
    return message.isProcessed === 0 
    }); 

    completed = this.messageArray.filter((message) => { 
    return message.isProcessed === 1 
    }); 

ありがとうございました！

編集： コンポーネントが起動すると、上記の例に示すように、コンポーネントは最初は空のままですが、サービスですぐにAJAX呼び出しを行ってユーザーのメッセージを取得し、その結果をmessageArrayそうです。

getMessages(info) { 
    let messageJSON = JSON.parse(info); 

    this.messageArray = messageJSON.m 
    } 

だから、理想的には、新しいコンテンツでMessageArrayを設定した後、それはまた、配列の「処理」を変更する必要があり、彼らはちょうどその配列のバージョンをフィルタリングしているとして、「完了」。

Edit2： これより簡単な例があります。私には2つの変数があります。 1つは 'x'で、もう1つはdoubleXと呼ばれるdoubleX = x * 2です。変数xが変更されたときに必要なのは、 'x'の新しい値を使うためにこの変数 'doubleX'が必要です。

Answer 1

messageArray: Array<any> = [] 

processing = this.messageArray.filter((message) => { 
    return message.isProcessed === 0 
}); 

completed = this.messageArray.filter((message) => { 
    return message.isProcessed === 1 
}); 

これが空であるmessageArrayの電流値に基づいてprocessingとcompleted計算します。したがって、これらの配列の両方は空です。あなたの質問で言ったように、これら2つの配列は、messagesArrayが変更されたときに計算される必要があります。したがって、コードは次のようにする必要があります。

messageArray: Array<any> = []; 
processing: Array<any> = []; 
completed: Array<any> = []; 

getMessages(info) { 
    let messageJSON = JSON.parse(info); 
    this.messageArray = messageJSON.m; 

    this.processing = this.messageArray.filter(message => message.isProcessed === 0); 

    this.completed = this.messageArray.filter(message => message.isProcessed === 1); 
} 

また、変数の入力をやめてください。要素の型として実クラスまたはインタフェースを使用します。