2017-01-29 6 views
1

* ngForでAngular2のコレクションを表示したい。集団グループ_idとアクセス

*ngFor ="let x in data" {{x._id.category}}のようなものを試しましたが、機能しませんでした。

enter image description here

は、どのように私は、このオブジェクトを表示することができますかマングースでそれを行う方法はありますか?私の知る限り見ることができるように

gquery= [{ 
    $group: { 
     _id: { category: '$category', specCategory: '$specCategory' }, 
     total:{ $sum:1 } 
    } 
}]; 

Experiences.aggregate(gquery, function (err, results) {  
    callback(err, results || {min: 0, max: 0}); 
}); 

HTML

<div class="col-sm-3"> 
    <select class="guest categorydd" [(ngModel)]="category_search" [ngModelOptions]="{standalone: true}" (ngModelChange)="changeCategory($event)"> 
     <option value="Alle Kategorien" >All Categories</option> 
     <option *ngFor="let x of countedCategory " value="{{x._id}}"> {{x._id}} ({{x.total}})</option> 
    </select> 
</div> 

コンポーネントファイル

countedCategory: any[]; 
this.countedCategory = data[0].priceBoundaries; 
+0

はあなたが私達にあなたのコンポーネントおよびテンプレートを表示することができますか? – shusson

+0

上記を参照してください。 * ngForが適用されている部分に – Tony

+0

とコンポーネント/コントローラを追加しましたか?すなわち 'countedCategory'を定義する場所を確認する必要があります – shusson

答えて

0

、あなたはこのような何か試してみてください:

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 
    </div> 

    <div class="col-sm-3"> 
     <select class="guest categorydd" [(ngModel)]="category_search" [ngModelOptions]="{standalone: true}" (ngModelChange)="changeCategory($event)"> 
     <option value="Alle Kategorien" >All Categories</option> 
     <option 
      *ngFor="let x of countedCategory" 
      [value]="x._id.category + '.' + x._id.specCategory"> 
      {{x._id.category}}: {{x._id.specCategory}} ({{x.total}}) 
     </option> 
     </select> 
    </div> 
    `, 
}) 
export class App { 
    name:string; 

    category_search; 
    countedCategory = [ 
    { 
     _id: { category: 'reisen', specCategory: 'romantik' }, 
     total: 100 
    }, 
    { 
     _id: { category: 'reisen', specCategory: 'abenteuer' }, 
     total: 77 
    }, 
    { 
     _id: { category: 'reisen', specCategory: 'essen' }, 
     total: 186 
    } 
    ]; 

    constructor() { 
    this.name = 'Angular2' 
    } 

    private changeCategory(event: any) { 
    console.log(event); 
    } 
} 

オブジェクトをvalueとして使用することはできません。結果は[object object]になります!

上記の例のように、独自のキーが必要または作成する必要があります。

ライブデモ:https://plnkr.co/edit/uy5VS9cOt73qY37kQ00X?p=preview

+0

私は複数のIDを取得するためにmongooseを使用しています。あなたの例で私はそれをどう扱うことができるかを知っていますが、私が探しているものではありません。私はオブジェクトにアクセスする必要があります{id:{category:data、specCategory:data}} – Tony

+0

私はあなたの問題を詳しく聞いていません。一例として、完全なJSONオブジェクト/配列を提供してください。それが簡単な場合は、 "一時的な"ドイツ語の説明も提供してください。:) – mxii

+0

ニュースはありますか?問題が解決したか、まだ存在していますか? :) – mxii

関連する問題