0

私はmongodbが初めてです。基本的に、コレクションからデータを取得して画面に表示しようとしています。そのangular2流星アプリ。mongo シェル内でデータを挿入および取得できます。しかし、値のブックマークをループしようとすると、エラーが発生します。

タイプ 'object' の異なるサポート オブジェクト '[object Object]' が見つかりません。NgFor は、配列などの Iterable へのバインドのみをサポートします。

find() メソッドから返されたデータをコンソール ログに記録すると、mongodb オブジェクト コレクション全体が返され、bomarks コレクションはオブジェクト内に深く埋め込まれています。

.find() メソッドを使用して返されたブックマーク変数内のすべてのオブジェクトの配列を取得するにはどうすればよいですか?

私のコンポーネントは以下の通りです：

import { Component } from '@angular/core';
import template from './bookmarks.component.html';
import { Bookmarks } from '../../../../collections/bookmarks';
import { Mongo } from 'meteor/mongo';
@Component({
  selector: 'bookmarks-list',
  template
})
export class bookmarksListComponent {
  bookmarks: Mongo.Cursor<Object>;
  constructor() {
    this.bookmarks=Bookmarks.find();
    console.log(this.bookmarks);
  }
}

html テンプレートは次のとおりです。

<tbody>
    <tr *ngFor="let bookmark of bookmarks">
        <td>{{bookmark.title}}</td>
        <td>{{bookmark.url}}</td>
        <td>{{bookmark.category}}</td>
        <td><button class="btn btn-danger">Delete</button></td>
    </tr>
</tbody>

エラーのスナップショット

4

2 に答える 2

2

rxjs を使用して解決策を見つけました: meteor/mongo を使用する代わりに、rxjs を使用して、mongo の collections.find() メソッドにサブスクライブします。また、mongo コレクションを新しくする際には、MongoObservable.collections コード全体を使用します。

ブックマーク.コンポーネント.ts:

import "reflect-metadata";
import { Component, OnInit, NgZone } from '@angular/core';
import template from './bookmarks.component.html';
import { Bookmarks, bookmark } from '../../../../collections/bookmarks';
import { Observable } from 'rxjs';
@Component({
  selector: 'bookmarks-list',
  template
})
export class bookmarksListComponent implements OnInit{
  private bookmarks: bookmark[];
  constructor(private zone: NgZone) {
  }
  ngOnInit(){
    Bookmarks.find({}).zone().subscribe({
      next: bookmarks => {
        console.log("Got Bookmarks: ", bookmarks);
        this.bookmarks=bookmarks;
      }
    });
  }
}

Bookmarks.ts (コレクション)

import { MongoObservable } from 'meteor-rxjs';
export interface bookmark {
    title: string;
    url: string;
    category: string;
}
export const Bookmarks= new MongoObservable.Collection<bookmark>('bookmarks');

Angular2-rxjs-meteor: このリポジトリからヘルプを入手してください https://github.com/ijager/meteor-rxjs-angular2.0.0-example.git

于 2016-09-29T05:16:33.847 に答える
0

本当に Mongo.Cursor を使用して実行したい場合は、コードで

constructor() {
this.bookmarks=Bookmarks.find();
console.log(this.bookmarks);
  }

交換this.bookmarks=Bookmarks.find();

とthis.bookmarks=Bookmarks.find({}).fetch();

于 2016-10-24T13:39:01.387 に答える