Question

我正在使用Angular 6和Firebase，我需要从firebase中获取所有项目，然后一次只显示一个，直到单击下一步为止。



/*this is the .ts file*/
    constructor( public af: AngularFire, public db: AngularFireDatabase) {
        this.items = db.list('items').valueChanges();
        db.list('/sentences').valueChanges().subscribe(sentences => {
          this.sentences = sentences;
          console.log(this.sentences);
        });
      }
<!--this in the html-->
    <div>
        <ul class="sent">
          <li *ngFor="let sentence of sentences"
              [class.selected]="sentence === selectedsentence"
              (click)="onSelect(sentence)">{{sentence}}

              <!-- this is displaying all the items in the firebase; i need only one at a time-->
          </li>
        </ul>
    </div>

Answer 1

//in the ts file
 constructor( public db: AngularFireDatabase) {
  this.items = db.list('items').valueChanges();
  db.list('/sentences').valueChanges().subscribe(sentences => {
    this.sentences = sentences;
    console.log(this.sentences);
    this.labels = this.sentences; //in this.labels we have all the elements *declaration : labels=[]
    console.log(this.labels);

  }); 
onSkip($i) {
  if (this.i > 13) { //if there are 13 elements in the database
    this.i = 0;
  }

  this.i = this.i + 1;
  console.log(this.i);
}    

 // in the html code
 {{labels[i]}}  

 <button class="centered" (click)="onSkip(i)" > SKIP  <a routerLink="skip">

单击按钮从Firebase选取项目

1 个答案: