角2属性'X'不存在于类型'Y'上

i'm quite new to angular 2 and i'm trying to refactor an app previously written in angular 1.

对于角2来说，我是全新的，我试着重构之前用角1写的应用。

This is my goodies component (witch basically shows posts fetched from a goodies category of a wordpress blog)

这是我的goodies组件(基本上是由一个wordpress博客的goodies分类来显示文章)

import { Component, OnInit } from '@angular/core';
import { ConfigService } from '../config/config.service';
import { FetchGoodiesService } from '../shared/fetch-goodies.service'
import { Goodie } from '../shared/goodie'



@Component({
    selector: 'app-goodies',
    templateUrl: './goodies.component.html',
    styleUrls: ['./goodies.component.css'],
    providers: [FetchGoodiesService, ConfigService],
})
export class GoodiesComponent implements OnInit {

    private goodies: Goodie[] = []
    private endpoint: string

    constructor(private _fetchGoodiesService : FetchGoodiesService) { }

    public ngOnInit() {
        this._fetchGoodiesService.getGoodies().subscribe( data => {
            this.goodies = data.posts 
            console.log("this goodies", data) 
        });
    }

}

Then i got my Goodie interface:

然后我得到了Goodie接口:

export interface Goodie {
    status: string
    pages: number
    count: number
    count_total: number
    posts: any
}

My goodies service to fetch the data from an endpoint

我的goodies服务从一个端点获取数据。

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { ConfigService } from '../config/config.service'
import { Goodie } from '../shared/Goodie'

import 'rxjs/Rx'`enter code here`
import 'rxjs/add/operator/map'


@Injectable()
export class FetchGoodiesService {

    private baseUrl: string
    private endpoints: any
    constructor(
        private _http: Http,
        private _configService: ConfigService,
    ) {
        this.endpoints = this._configService.getProperty("endpoints")
        this.baseUrl = this.endpoints.baseUrl
    }

    public getGoodies(): Observable<Goodie[]> {
        return this._http.get( this.baseUrl + this.endpoints.getCategoryPost + 'goodies' )
                .map(res => res.json())
    }


    private handleError(error) {
        console.log(error)
    }

}

and this is a mock of the json i'm reciving from the endpoint

这是我从端点接收到的json。

{
    "status": "ok",
    "count": 9,
    "count_total": 9,
    "pages": 1,
    "posts": [
        {..},
        {..}
    ]
}

My problem is that the compiler return me an error on this line of the goodies component: this.goodies = data.posts as i get: Property 'posts' does not exist on type 'Goodie[]'

我的问题是，编译器在goodies组件的这一行上返回一个错误:这个。糖果=数据。我得到的帖子:属性“帖子”并不存在于类型“Goodie[]”中

I thought that declaring posts:any on the interface would work but it doesnt. Thanks to anyone that can help me out.

我认为发布帖子:界面上的任何东西都有用，但它没有。谢谢任何能帮我的人。

1 个解决方案

#1

I've found a walkaround that makes the app working, however i dont like it too much. I'm wondering if there is a clearner solution to my problem.

我发现了一个让应用程序正常运行的方法，但是我不太喜欢它。我想知道我的问题是否有明确的解决办法。

this is the walkaround code:

这是围绕着的代码:

export class GoodiesComponent implements OnInit {
    private res:any
    private goodies: Goodie[] = []
    private endpoint: string

    constructor(private _fetchGoodiesService : FetchGoodiesService) { 
    }

    public ngOnInit() {
        this._fetchGoodiesService.getGoodies().subscribe( data => {
            this.res = data
            this.goodies = this.res.posts
            console.log("this goodies", data) 
        });
    }

}

#1