Question

错误：XHR错误（404）加载https://run.plnkr.co/aT9KvIPBnvAmjN8u/models/home

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

我创建了models/home.ts

其中包含：

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());
    });
  }
}

然而无法找到

Answer 1

将models文件夹移至src文件夹

并执行此操作：

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

您的所有代码都必须位于src文件夹下，因为在您的config.js文件中，您告诉System.js您的应用位于src文件夹中：

//config.js
map: {
    app: "./src"
  },

为什么我的Angular2应用程序找不到我的模型？

1 个答案: