首页 文章

如何在Angular2中将Observable从服务转换为数组到ngFor？

提问于
浏览 次
0

我有一个返回类型的问题 . 这是我的问题：首先我的数据结构是： {"categoryName":"Google","id":"58591d2b7672d99910497bec","clientId":"585808f6737f6aad1985eab2"},{"categoryName":"Yahoo","id":"58591d4c7672d99910497bef","clientId":"585808f6737f6aad1985eab2"},{"categoryName":"Msn","id":"585d25f6ae4b2ecb056bc514","clientId":"585808f6737f6aad1985eab2"}

我有一个HTML文件，其中包含：

<tr *ngFor="let category of categories; let id = index">
                        <td>
                            <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-data-table__select"
                                   for="row[3]">
                                <input type="checkbox" id="row[3]" class="mdl-checkbox__input"/>
                            </label>
                        </td>
                        <td class="mdl-data-table__cell--non-numeric"><a [routerLink]="['/category/links']"></a>{{
                            category.categoryName }}
                        </td>
                        <td class="mdl-data-table__cell--non-numeric">{{category.categoryName}}</td>
                         <td #category.id><i (click)="deleteCategory(id)" class="material-icons">delete</i></td>
                    </tr>

组件如下（我只在这里写ngOnInit（））：

ngOnInit(): void
    {
        this.categoryService.getCategories().subscribe((data) => {
               this.categories=data;
                console.log("data inside component" + data);
            }
        )
            //console.log(JSON.stringify(this.categories));
    //        .map((data) =>
    //        {
    //            this.categories=data;
    //        })
    }

而服务是：

getCategories(){
        return this.category.find({where: {clientId: this.userApi.getCurrentId()}}).map((data) => {

            console.log("type of data: "+ typeof(data));

            console.log ("data:" + JSON.stringify(data));
            //return data;
        }, err => {
            console.log(err);
        });
    };

如果我从服务中执行console.log，则会显示数据 . 如果我从组件执行console.log，则不会显示任何内容：消息为：

data inside componentundefined

好像“数据”没有从服务传递给组件，没有传递，或者没有从正确的类型传递 .

任何的想法？

在此先感谢您的问候

angular observable

1 回答

  • 1

    在 map 语句中取消注释 . 因为在对数据进行映射后没有返回任何内容，所以返回了 undefined .

    getCategories() {
   return this.category.find({where: {clientId: this.userApi.getCurrentId()}}).map((data) => {

     console.log("type of data: "+ typeof(data));

     console.log ("data:" + JSON.stringify(data));
     return data; // uncomment this line
   }, err => {
      console.log(err);
   });
};
    回复于

相关问题