*ngIf binding with is not working properly

@ayubIonicpro wrote:

I’m saving checkbox values on firebase database and fetching it to show last checked values on screen. Fetching title and location from api and checkbox values from firebase but unable to bind them accordingly. I’m fetching data correctly from firebase but unable to put correctly on page.

home.html

 <button class="listItem" ion-item *ngFor="let h of hunts | slice:0:23; let i=index">
            <h3>{{h.title}}</h3>
            <p>{{h.location}}</p>
            <div item-end *ngIf="myVar == false">
                <ion-item style="width: 55px; background: #24252D !important;">
                    <ion-checkbox checked="false" [(ngModel)]="completed[i]" (ionChange)="updateHunt(completed)" ></ion-checkbox>
                </ion-item>
            </div>

            <div item-end *ngIf="myVar == true">
                <ion-item style="width: 55px; background: rgb(29, 29, 34) !important;">
                    <ion-checkbox checked="true" [(ngModel)]="completed[i]" (ionChange)="updateHunt(completed)" ></ion-checkbox>
                </ion-item>
            </div>
        </button>

Home.ts

//: JSON Data Request
 this.http.get('https://api.myjson.com/bins/o18tj').map(res => res.json())
            .subscribe(data => {

                    //: Gets Json data
                    this.hunts = data.data;

                    //: Checkbox model gets length of array.
                    this.completed = new Array(this.hunts.length);

                    loading.dismiss(data.data);

                },
                err => {
                    loading.dismiss();
                    console.log('HTTP GET ERROR: ', err);
                }
            );

        //: Firebase reference to where the checkbox data is saved
        // for some reason this is not working: .child(firebase.auth().currentUser.uid), it gives me error whrn adding it to thr end of ref().
        for(let i=0; i<5; i++){
            let userHuntRef = firebase.database().ref('/CompletedHuntsQuest').child('vOpO5chW98UIovTwpg3KMTGaOoj2').child('Hunts').child('complete');
            userHuntRef.on('value', completedHunt => {
                this.userHunt = completedHunt.val()[i];
                if(this.userHunt == true){
                    this.myVar = true;
                    console.info("Firebase Values: "+i, this.userHunt);
                    console.info("Firebase Var: "+i, this.myVar);
                }else{
                    this.myVar = false;
                    console.info("Firebase Values: "+i, this.userHunt);
                    console.info("Firebase Var: "+i, this.myVar);
                }
            })
        }

Regards,
Ayub

Posts: 5

Participants: 3

Read full topic