2017-03-07 91 views
0

Error: XHR error (404) loading https://run.plnkr.co/aT9KvIPBnvAmjN8u/models/home爲什麼我的Angular2應用程序無法找到我的模型?

Plnkr鏈接:https://plnkr.co/edit/gwa3NWArtWK0wjf2jr2h?p=preview

我創建models/home.ts

enter image description here

其中包含:

export function homeData() { 
    return [ 
    { id: 0, 
     title: '2017 Oscars', 
     graphic: 'https://wikitags.com/images/OscarsBanner.png', 
     categorycards: [ 
     { 
      type: 'image', 
      graphic: 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Ryan_Gosling_2_Cannes_2011_%28cropped%29.jpg/1024px-Ryan_Gosling_2_Cannes_2011_%28cropped%29.jpg?width=440', 
      title: '2017 Oscar Nominee for Best Actor', 
      listings: ['Rayn Gosling', 'Denzel Washington', 'Andrew Garfield', 'Casey Affleck', 'Viggo Mortensen'] 
     }, 
     { 
      type: 'image', 
      graphic: 'https://commons.wikimedia.org/wiki/Special:FilePath/Meryl_Streep_February_2016.jpg?width=440', 
      title: '2017 Oscar Nominee for Best Actress', 
      listings: ['Meryl Streep', 'Emma Stone', 'Natalie Portman', 'Ruth Negga'] 
     }, 
     { 
      type: 'image', 
      graphic: 'https://commons.wikimedia.org/wiki/Special:FilePath/Dev_Patel_(29870651654).jpg?width=440', 
      title: '2017 Oscar Nominee for Best Supporting Actor', 
      listings: ['Dev Patel', 'Jeff Bridges', 'Michael Shannon', 'Lucas Hedges', 'Mahershala Ali'] 
     }, 
     { 
      type: 'image', 
      graphic: 'https://commons.wikimedia.org/wiki/Special:FilePath/Michelle_Williams_by_Gage_Skidmore.jpg?width=440', 
      title: '2017 Oscar Nominee for Best Supporting Actress', 
      listings: ['Michelle Williams', 'Nicole Kidman', 'Viola Davis', 'Octavia Spencer'] 
     } 
     ] 
    } 
    ]; 
} 

然後在我的categoryService.ts我導入它,像這樣:

import {Injectable} from 'angular2/angular2'; 
import {Http} from 'angular2/http'; 
import {homeData} from 'models/home'; // <- here it is with correct path 

@Injectable() 
export class CategoryService { 
    constructor(http:Http) { 
    this.categories = http.get('api/categories.json').map(res => { 
     // console.log(res) 
     // return res.json(); 
     return res.send(homeData()); 
    }); 
    } 
} 

然而,它不能被發現

enter image description here

回答

2

移動你models文件夾複製到文件夾src

,並做到這一點:

import {homeData} from './models/home'; 

所有的代碼必須是下src文件夾,因爲在您的config.js文件中,您告訴System.js您的應用程序位於src文件夾:

//config.js 
map: { 
    app: "./src" 
    }, 
相關問題