我在AngularJS中有一个静态下拉列表,希望它与Firebase一起动态

时间:2021-05-27 22:59:46

I have an ionic, typescript, AngularJS, Pohnegap developed app. One function that I have is to collect information male or female - I have made this static form

我有一个离子,打字稿,AngularJS,Pohnegap开发的应用程序。我的一个功能是收集男性或女性的信息 - 我已经制作了这种静态形式

<ion-item>
<ion-label>Brand</ion-label>
  <ion-select interface="popover">
    <ion-option value="heineken">Heineken</ion-option>
    <ion-option value="carlsberg">Carlsberg</ion-option>
  </ion-select>
</ion-item>

That works and you can select either Female or Male, I like to make this dynamic by pulling the data to select from Firebase.

这是有效的,您可以选择女性或男性,我喜欢通过拉动数据从Firebase中选择来实现动态。

So I did this in my html file

所以我在我的html文件中这样做了

<ion-item>
  <ion-label stacked>Type of Trash</ion-label>
      <ion-select [(ngModel)]="BrandsList (ionChange)="onSelectChange($event)">
       <ion-option value="typeofbrand" *ngFor="let title of BrandsList"> {{title}}
      </ion-option>  
      </ion-select>
</ion-item>

And in my .ts file I added this

在我的.ts文件中,我添加了这个

    BrandsList: FirebaseListObservable<any>;
    ...
    this.BrandsList = db.list('/brands/');

I can not get the dynamic part to work, any ideas what I'm doing wrong.

我不能让动态部分发挥作用,任何想法我做错了。

See below for the image from my firebase database.

请参阅下面的firebase数据库中的图像。

我在AngularJS中有一个静态下拉列表,希望它与Firebase一起动态

Appreciate any help, I can get.

感谢任何帮助,我可以得到。

1 个解决方案

#1


0  

I think you should change this part:

我想你应该改变这一部分:

<ion-item>
  <ion-label stacked>Type of Trash</ion-label>
      <ion-select [(ngModel)]="BrandsList (ionChange)="onSelectChange($event)">
       <ion-option value="typeofbrand" *ngFor="let title of BrandsList"> {{title}}
      </ion-option>  
      </ion-select>
</ion-item>

to this other one:

到另一个:

<ion-item>
  <ion-label stacked>Type of Trash</ion-label>
      <ion-select [(ngModel)]="BrandsList (ionChange)="onSelectChange($event)">
       <ion-option value="typeofbrand" *ngFor="let brand of BrandsList"> {{brand.title}}
      </ion-option>  
      </ion-select>
</ion-item>

Because you have to search first on the brand and after on the property

因为您必须先搜索品牌,然后再搜索酒店

I hope this works to you! (:

我希望这对你有用! (:

#1


0  

I think you should change this part:

我想你应该改变这一部分:

<ion-item>
  <ion-label stacked>Type of Trash</ion-label>
      <ion-select [(ngModel)]="BrandsList (ionChange)="onSelectChange($event)">
       <ion-option value="typeofbrand" *ngFor="let title of BrandsList"> {{title}}
      </ion-option>  
      </ion-select>
</ion-item>

to this other one:

到另一个:

<ion-item>
  <ion-label stacked>Type of Trash</ion-label>
      <ion-select [(ngModel)]="BrandsList (ionChange)="onSelectChange($event)">
       <ion-option value="typeofbrand" *ngFor="let brand of BrandsList"> {{brand.title}}
      </ion-option>  
      </ion-select>
</ion-item>

Because you have to search first on the brand and after on the property

因为您必须先搜索品牌,然后再搜索酒店

I hope this works to you! (:

我希望这对你有用! (: