[英]angular2 rc5 upgrade, iterating over mongo cursor fails
I'm writing a meteor/angular2 app, and I have just upgraded to rc5. 我正在编写一个meteor / angular2应用程序,并且我刚刚升级到rc5。 I get an error when I try to show a list of messages based on a mongo cursor in my component.
当我尝试在组件中基于mongo游标显示消息列表时出现错误。 I have tried to distill the code down, please let me know, if you need something more.
我已尝试将代码精简下来,如果您需要更多内容,请告诉我。
Here is the component: 这是组件:
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();
}
}
Here is the html template: 这是html模板:
<ul>
<li *ngFor="let message of messages">
{{message}}
</li>
</ul>
This fails with a long stacktrace when I try to view the page, and several nested errors, but I think this seems to be the root of it: 当我尝试查看页面时,此操作会出现较长的堆栈跟踪信息,并出现一些嵌套错误,但我认为这似乎是其根源:
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')
I can make the code work again by either changing the view or the component code as follows: 通过更改视图或组件代码,可以使代码再次工作,如下所示:
View: 视图:
<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 = []
}
}
Here are the dependencies of my package.json: 这是我的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"
}
Does anyone have an idea how to solve this? 有谁知道如何解决这个问题?
I am facing quite the same issue, as you can see here . 正如您在此处看到的,我面临着同样的问题。
First I had the error message "NgFor only supports binding to Iterables such as Arrays.", as I tried to iterate over a Mongo.Cursor. 首先,当我尝试在Mongo.Cursor上进行迭代时,出现了错误消息“ NgFor仅支持绑定到数组等Iterables。”。
The only idea I found was to fetch the cursor and to use an array instead. 我发现的唯一想法是获取游标并改用数组。 But the array did not contain any data, so I concluded that maybe there is no data available on client side and it's a Meteor issue.
但是该数组不包含任何数据,因此我得出结论,也许客户端上没有可用数据,这是一个流星问题。 Maybe I am wrong and there is just an another way to transform the data from the cursor.
也许我错了,还有另一种方法可以从游标转换数据。
Today I also tried to solve this issue according to this file , but setting up this project failed. 今天,我也尝试根据此文件解决此问题,但是设置该项目失败。
Unfortunately, I did not find any useful and working examples according Angular 2 RC 5 and meteor mongo cursors, but I continue searching. 不幸的是,根据Angular 2 RC 5和流星mongo光标,我没有找到任何有用且可行的示例,但我继续搜索。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.