Изменить значок иона, если элемент существует в Firebase

Я пытаюсь разработать простую систему избранного для списка продуктов, используя Ionic 3 и Firebase. Процесс, который записывает избранное пользователя (и это исключает их также), работает отлично.

list.html

<ion-fab top right>
  <button ion-fab (click)="addToFavorites(item, i)">
    <ion-icon [name]="item.visible ? 'star' :'star-outline'">
    </ion-icon>
  </button>
</ion-fab>

list.ts (вставить и удалить избранное для данного пользователя)

addToFavorites(item, i:number){
  item.visible = item.visible ? false : true;
  var i = this.favorites.indexOf(item);
  this.afAuth.authState.subscribe(user => {
    if(user){
      this.userId = user.uid;
      if(i === -1){
          this.db.object(`favoritos/${this.userId}/${item.id}`).set(item);
      }else{
          this.db.object(`favoritos/${this.userId}/${item.id}`).remove()
      }
    } else{
      this.navCtrl.push(LoginPage);
    }
  })  
}

В приведенном выше коде, когда пользователь нажимает на значок "звездообразный контур", он изменяется на "звездочку" и вставляет идентификатор пользователя, а под ним - идентификаторы избранных продуктов.

Но сейчас я безуспешно пытаюсь отобразить измененный значок иона в соответствии с существованием элемента в Firebase.

list.ts (чтение всех данных из узла "favitos" в Firebase и попытка изменить значок иона на "звезду", когда элемент существует)

constructor(public navCtrl: NavController, public navParams: NavParams,  public listservice: ListService, public db: AngularFireDatabase, private afAuth: AngularFireAuth) {
  this.afAuth.authState.subscribe(user => {
    if(user){
      this.userId = user.uid;
      this.favMotos = this.db.list(`favoritos/${this.userId}`).valueChanges();
      this.favMotos.subscribe(item => {
        if(item){
          item.visible = true;
        }else{
          item.visible = false;
        }
      })
    }
  })
}

Но когда я возвращаюсь на эту страницу, значок больше не "звездочка", а по умолчанию для не избранных (контур звездочки).

РЕДАКТИРОВАТЬ

Я пытался поменять собственность name как двусторонняя привязка данных:

<ion-fab top right>
  <button ion-fab (click)="addToFavorites(item, i)">
    <ion-icon [(name)]="item.visible ? 'star' :'star-outline'">
    </ion-icon>
  </button>
</ion-fab>

Но он отображает следующую ошибку:

Parser Error: Unexpected token '=' at column 39 in [item.visible ? 'star' : 'star-outline'=$event] in ng:///AppModule/ListPage.html@35:26 ]
("p right>
    <button ion-fab (click)="addToFavorites(item, i)">
      <ion-icon [ERROR ->][(name)]="item.visible ? 'star' : 'star-outline'">
      </ion-icon>
    </button")

0 ответов

Другие вопросы по тегам