Question

我已经创建了一个示例ionic2应用程序，我通过一个简单的web api获取了一个项目列表。当我点击某个项目的按钮时，我想看到一些细节，但是我收到的消息是该服务在我的详细信息页面的类型上不存在。这就是我所拥有的：

项-list.ts

import {Component} from '@angular/core';
import {Item} from "../../model/item.model";
import { ItemService } from "../../service/item.service";
import { HTTP_PROVIDERS } from "@angular/http";
import {NavController, NavParams} from 'ionic-angular';
import {ItemDetailsPage} from '../item-details/item-details';

@Component({
    templateUrl: 'build/pages/item-list/item-list.html',
    providers: [ItemService, HTTP_PROVIDERS]
})

export class ItemListPage {
    items:Item[] = [];

    constructor(private itemService:ItemService, public 

navCtrl:NavController, navParams: NavParams)

    {

        this.getItems();    
    }

    getItems()
    {
        this.itemService.getItems()
            .subscribe(
                itemData => this.items = itemData,
                err => console.log(err),
                () => console.log('Items ophalen compleet.')
            )
    }

    itemTapped(event, itemCode) {
        this.navCtrl.push(ItemDetailsPage, {
            itemCode: itemCode
        });
    }  
}

要获取项目的详细信息，请单击触发itemTapped：

的按钮

项-list.html

<ion-header>
    <ion-navbar>
        <button menuToggle>
           <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>Artikelen</ion-title>
    </ion-navbar>
</ion-header>

在details-page我的以下代码：

项-details.ts

import {Component} from '@angular/core';
import {Item} from "../../model/item.model";
import {NavController, NavParams} from 'ionic-angular';
import {ItemStockPosition} from "../../model/itemStockPosition.model";
import { ItemStockPositionService }

from "../../service/itemStockPosition.service";

import { HTTP_PROVIDERS } from "@angular/http";


@Component({
    templateUrl: 'build/pages/item-details/item-details.html',
    providers: [ItemStockPositionService, HTTP_PROVIDERS]
})

export class ItemDetailsPage {
    //selectedItem: string;
    stockPositions: ItemStockPosition[] = [];

    constructor(private itemStockPositionService:ItemStockPositionService, public navCtrl: NavController, navParams: NavParams) {
    this.getStockPosition(navParams.get('itemCode'));

    }
    getStockPosition(itemCode){
        this.itemStockPositonService.getStock(itemCode)
        .subscribe(
            stockData => this.stockPositions = stockData,
            err => console.log(err),
            () => console.log('Items ophalen compleet.')
        )
    }

 }

在item-details.ts中，系统在this.itemStockPositionService上发出错误：

Property＆＃39; itemStockPositionService＆＃39;在类型上不存在＆＃39; ItemDetailsPage＆＃39;

我的ItemStockPositionService看起来像这样：

import { Injectable } from '@angular/core';
import { ItemStockPosition } from '../model/itemStockPosition.model';
import { Http } from '@angular/http';
import 'rxjs/Rx';

const makeUrl = (itemCode) => 

`http://desktopnnc10c9/BasiqInventory/api/item/GetItemStock/${itemCode}`;


@Injectable()

export class ItemStockPositionService{
    constructor(private http:Http){

    }

    // retourneer alle items
    getStock(itemCode){

        return this.http.get(makeUrl(itemCode))
            .map(res => <ItemStockPosition[]> res.json());
    }

}

Answer 1

你在itemStockPosit [i] onService上有拼写错误。在getStockPosition函数中缺少i。

物业＆＃39; xxx服务＆＃39;类型＆＃39; xxxDetailsPage＆＃39;上不存在

1 个答案: