Mongodb 按多个值筛选对象

Mongodb 按多个值筛选对象,mongodb,angular,typescript,ionic-framework,ionic2,Mongodb,Angular,Typescript,Ionic Framework,Ionic2,我正在使用离子2和Angular 2创建一个应用程序,我遇到了一点障碍 我的应用程序正在从使用命令返回mongo对象的API获取数据。此对象包含一组不同的商店,其中包含营业时间等信息: { "_id" : ObjectId("585723490a60e14d8a41ffd3"), "storeID" : NumberInt(1110), "storeName" : "Kvickly Sundby", "chain" : "kvickly", "phone" : NumberInt(32

我正在使用离子2和Angular 2创建一个应用程序,我遇到了一点障碍

我的应用程序正在从使用命令返回mongo对象的API获取数据。此对象包含一组不同的商店,其中包含营业时间等信息:

{ 
"_id" : ObjectId("585723490a60e14d8a41ffd3"), 
"storeID" : NumberInt(1110), 
"storeName" : "Kvickly Sundby", 
"chain" : "kvickly", 
"phone" : NumberInt(32860111), 
"openingDates" : [
    {
        "open" : "08.00", 
        "close" : "20.00", 
        "date" : "2016-12-13", 
        "_id" : ObjectId("585723490a60e14d8a41ffef")
    }, 
    {
        "open" : "08.00", 
        "close" : "20.00", 
        "date" : "2016-12-14", 
        "_id" : ObjectId("585723490a60e14d8a41ffee")
    }
], 
"location" : {
    "address" : "Englandsvej 28", 
    "city" : "København S", 
    "zip" : NumberInt(2300), 
    "coordinates" : [
        12.6048, 
        55.65654
    ]
}, 
"__v" : NumberInt(0)
}

数据被传递到我的模板,循环并显示在具有手风琴功能和分页功能的卡片上

从API获取

getStores(lat, lng) {
    this.fetchUrl = this.envVar.getEnvUrl() + '?lat=' + lat + '&lng=' + lng;
    console.log(this.fetchUrl);
    this.http.get(this.fetchUrl)
      .map(res => res.json())
      .subscribe(data => {
        this.stores = data;
        this.loading.dismiss();
        this.curPage = 1;
    });
  }
模板

<accordion>
        <accordion-group *ngFor="let store of stores | paginate: { itemsPerPage: 15, currentPage: p }; let first = first" [isOpened]="first">
            <accordion-heading>
                <ion-card class="store-card" [style.border-color]="storeColor(store.obj.chain)">
                    <ion-row>
                        <ion-col width-67>
                            <ion-col>
                                <h2 class="store-name">{{store.obj.storeName}}</h2>
                                <p class="store-location">{{store.obj.location.address}} <br> {{store.obj.location.city}}, {{store.obj.location.zip}}</p>
                                <ion-icon  ios="ios-arrow-down" md="ios-arrow-down"></ion-icon>
                            </ion-col>
                        </ion-col>
                        <ion-col width-33>
                            <ion-col width-100 *ngFor="let date of store.obj.openingDates | where : {date : today}" class="opening-hours"><p>{{date.open}} - {{date.close}}</p></ion-col>
                            <ion-col width-100 class="distance">
                                <p>{{store.dis | formatDistance}} <ion-icon name="pin"></ion-icon></p>
                                <p><a target="_blank" href="http://www.google.com/maps/place/{{store.obj.chain}} {{store.obj.location.address}}, {{store.obj.location.zip}} {{store.obj.location.city}}">Rutevejledning</a></p>
                            </ion-col>
                        </ion-col>
                    </ion-row>
                </ion-card>
            </accordion-heading>
            <div class="extra-info">
                <ion-grid>
                    <ion-row>
                        <ion-col width-100>
                            <p class="week">Uge {{weekNumber}}</p>
                        </ion-col>
                    </ion-row>
                    <ion-row width-100 *ngFor="let date of store.obj.openingDates | afterWhere: {date: tomorrow} | slice:0:leftInWeek">
                        <ion-col width-50 class="weekday">{{date.date | date: "EEEE, d MMMM"}}</ion-col>
                        <ion-col width-50 class="hours">{{date.open}} - {{date.close}}</ion-col>
                    </ion-row>
                </ion-grid>
            </div>
        </accordion-group>
    </accordion>

Uge{{{weekNumber}

{{date.date}date:“EEEE,d MMMM”} {{date.open}-{{date.close}
这一切都很好,但我希望能够通过对象中的“chain”属性过滤结果,这样我只能得到一些chains(沃尔玛、好市多等)

我只是不知道该怎么处理。在Ionic提供的导航中,我有一系列用于不同链的切换开关(它们是硬编码的,不用担心),我想用于过滤:

导航开关

<ion-content>
<ion-item>
  <ion-label>Chain 1</ion-label>
  <ion-toggle></ion-toggle>
</ion-item>

<ion-item>
  <ion-label>Chain 2</ion-label>
  <ion-toggle></ion-toggle>
</ion-item>

<ion-item>
  <ion-label>Chain 3</ion-label>
  <ion-toggle></ion-toggle>
</ion-item>

链1
链2
链3

最初我希望在Angular 2版本的中使用类似filterBy的东西,但filterBy只接受一个值作为筛选依据,因此在我的场景中不是很有用

那么这里最好的选择是什么?某种定制的过滤管?我是在最后一个对象中排序,还是在返回数据之前将一些参数传递给api和limit


这有点让人困惑,这是我的第一个Angular项目,所以我非常希望能得到一些指导,告诉我如何(以最好的方式)做到这一点。

我会像你提到的那样,通过查询API来解决这个问题。我不确定数据的规模,但将过滤添加到API中可以使应用程序在规模上更高效

如果你不想走那条路,我会看看管道。它们是知道如何使用和创建的非常有用的工具

angular 2文档提供了有关如何创建管道的指南。查看飞行英雄管道部分。这是一个很好的例子

模板

<div *ngFor="let hero of (heroes | flyingHeroes)">
  {{hero.name}}
</div>
import { Pipe, PipeTransform } from '@angular/core';
import { Flyer } from './heroes';

@Pipe({ name: 'flyingHeroes' })
export class FlyingHeroesPipe implements PipeTransform {
  transform(allHeroes: Flyer[]) {
    return allHeroes.filter(hero => hero.canFly);
  }
}
创建管道后,可以在转换方法中以任何方式转换数据。在他们的例子中,他们使用过滤函数,只返回英雄。在您的情况下,可以将.canFly检查替换为以下内容:

let wantedChains = ['Costco', 'Walmart', 'etc...']
transform(stores: Store[]) {
    return stores.filter(store => (wantedChaines.indexOf(store.chain) > -1));
}

已经有一段时间没有做任何工作了,但我最终决定正确地完成它并在服务器端实现它。不过,我还是非常感谢你的详尽回答!