リアルタイムでイオントグルステータスを更新するにはどうすればいいですか？

Question

私は自分のステータスをfirebaseデータベースに保存するアプリケーションにイオントグルを持っていますが、firebaseからロードされたデータを使ってステータスを変更する方法はありますか？

たとえば、データベース内のステータスがtrueの場合、ビューをロードするとトグルがオンになります。私はチェックを試みました：

<ion-toggle checked="status()" > 

ここで、status（）はブール値を返します。

しかし、firebaseの非同期関数のために、viewはstatus（）の値より1番目の値をロードします。これまでのところ、この問題の解決策を見つけることができません。

Answer 1

はい、これを行う方法はありますが、属性内の関数を使用するのは良いことではありません。 DOM内で値を返す関数を使用すると、DOMに変更があるたびにその関数が実行されるため、これはFirebaseで何かを取得する関数なので、ユーザーはFirebaseにリクエストを行うようになりますDOMが更新される時刻。

これを行う良い方法は、Firebaseの結果を変数に保存することです。

public myStatus: boolean; 

// USING A LIFECYCLE HOOK 
ionViewWillLoad(){ 
    firebase.database().ref(`Path/To/Your/Status`).once('value', snapshot => { 
    this.myStatus = snapshot.val(); 
    }); 
} 

そして、あなたのHTML内

<ion-toggle [checked]="myStatus"> 
<!-- You need to bind your checked attribute to myStatus, using checked="{{myStatus}}" also works --> 

あなたの状況は、あなたが作成およびfirebase上で観察することができます変更された場合にはいつも、チェックする必要がある場合：あなたはデ・ページを入力するときは、次のように行うことができますこのことができます

ionViewWillLoad(){ 
    firebase.database().ref(`Path/To/Your/Status`).once('value', snapshot => { 
    this.myStatus = snapshot.val(); 
    }); 
    firebase.database().ref(`Path/To/Your/Status`).on('child_changed', snapshot => { 
    this.myStatus = snapshot.val(); 
    }); 

    // YOU'LL NEED BOTH SINCE THE FIRST LOADS THE STATUS FOR THE FIRST TIME AND THE SECCOND CREATES AN OBSERVABLE FOR WHEN THE STATUS CHANGE. 
} 

希望：あなたのステータスが変更した場合、あなたはあなたのトグルを変更することができます。