2016-09-13 3 views
0

Ich schreibe eine Meteor/angular2 App, und ich habe gerade auf rc5 aktualisiert. Ich erhalte eine Fehlermeldung, wenn ich versuche, eine Liste von Nachrichten anzuzeigen, die auf einem Mongo-Cursor in meiner Komponente basieren. Ich habe versucht, den Code zu destillieren, bitte lassen Sie mich wissen, wenn Sie etwas mehr brauchen. Hierangular2 rc5 Upgrade, Iterieren über Mongo-Cursor schlägt fehl

ist die Komponente:

import { Component, OnInit } from '@angular/core'; 
import { Mongo } from 'meteor/mongo'; 

import template from './messages-list.component.html'; 

@Component({ 
    selector: 'messages-list', 
    template 
}) 

export class MessagesListComponent implements OnInit { 
    messages: Mongo.Cursor<string>; 
    collection: Mongo.Collection<string> 

    ngOnInit() { 
    // just create an empty local collection for brevity, but it also fails with a named client/server collections 
    this.collection = new Mongo.Collection<string>(null); 
    this.messages = this.collection.find();  
    } 
} 

Hier ist die HTML-Vorlage:

<ul> 
    <li *ngFor="let message of messages"> 
    {{message}} 
    </li> 
</ul> 

Dies scheitert mit einem langen Stacktrace wenn ich versuche, die Seite, und mehrere verschachtelte Fehler anzuzeigen, aber ich denke, dies ist die Wurzel es zu sein scheint:

Unhandled Promise rejection: (7) 
"EXCEPTION: Error in ./MessagesListComponent class MessagesListComponent - inline template:0:10 
ORIGINAL EXCEPTION: TypeError: undefined is not an object (evaluating 'async_1.ObservableWrapper.subscribe') 

ich kann den Code funktioniert wieder entweder durch Ändern der Ansicht oder der Komponentencode wie folgt:

Ausblick:

<ul> 
    <!-- avoid iterating over messages --> 
    <!--li *ngFor="let message of messages"> 
    {{message}} 
    </li--> 
</ul> 

Code:

// use a normal array instead of a cursor 
export class MessagesListComponent implements OnInit { 
    messages: string[] 

    ngOnInit() { 
    this.messages = [] 
    } 
} 

Hier sind die Abhängigkeiten von meiner package.json:

"dependencies": { 
    "@angular/common": "2.0.0-rc.5", 
    "@angular/compiler": "2.0.0-rc.5", 
    "@angular/core": "2.0.0-rc.5", 
    "@angular/forms": "0.3.0", 
    "@angular/platform-browser": "2.0.0-rc.5", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
    "@angular/router": "3.0.0-rc.1", 
    "angular2-meteor": "0.6.2", 
    "angular2-meteor-auto-bootstrap": "0.6.0", 
    "angular2-meteor-polyfills": "0.1.1", 
    "angular2-meteor-tests-polyfills": "0.0.2", 
    "es6-shim": "0.35.1", 
    "material-design-lite": "^1.2.0", 
    "meteor-node-stubs": "0.2.3", 
    "reflect-metadata": "0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "zone.js": "0.6.12" 
} 

Hat jemand eine Idee, wie man das löst?

Antwort

1

Ich bin mit dem gleichen Problem konfrontiert, wie Sie here sehen können.

Zuerst hatte ich die Fehlermeldung "NgFor unterstützt nur die Bindung an Iterables wie Arrays.", Als ich versuchte, über einen Mongo.Cursor zu iterieren.

Die einzige Idee, die ich fand, war den Cursor zu holen und stattdessen ein Array zu verwenden. Da das Array jedoch keine Daten enthielt, kam ich zu dem Schluss, dass auf der Client-Seite möglicherweise keine Daten verfügbar sind und es sich um ein Meteor-Problem handelt. Vielleicht liege ich falsch und es gibt nur eine andere Möglichkeit, die Daten vom Cursor zu transformieren.

Heute habe ich auch versucht, dieses Problem nach this file zu lösen, aber das Einrichten dieses Projekts ist fehlgeschlagen.

Leider habe ich keine brauchbaren und funktionierenden Beispiele nach Angular 2 RC 5 und Meteor Mongo Cursor gefunden, aber ich suche weiter.