Angular 2 - 如何使用外部文件中的JSON数据填充局部变量

eba*_*nin 22 json angular

我读过的Angular 2教程直接在app.component.ts文件中放置变量.例如var BAR下面,它通过{Foo}接口提取数据.

import {Component} from 'angular2/core';
import {Foo} from './foo';

@Component({
   etc.
});

export class AppComponent {
   bar = BAR;
}

var BAR: Foo[] = [
   { 'id': 1 },
   { 'id': 2 }
];
Run Code Online (Sandbox Code Playgroud)

但是,我在本地JSON文件中有BAR的数据.我不相信{HTTP_PROVIDER}是必要的.我如何从外部文件中获取JSON数据?

Wil*_*ila 12

使用此内容创建文件

export const BAR= [ { 'id': 1 }, { 'id': 2 } ];

保存为BarConfig.ts或类似

以后使用如下

import { BAR } from './BarConfig'; let bar= BAR;

甚至更好,BAR直接在您需要的地方使用


TGH*_*TGH 5

HTTP_PROVIDER 如果要使用http加载文件,则需要.

以下是如何通过http加载本地json文件的示例:

this.result = {friends:[]};
this.http.get('./friends.json').map((res: Response) => res.json()).subscribe(res => this.result = res);                    
Run Code Online (Sandbox Code Playgroud)

更多细节在这里:http://www.syntaxsuccess.com/viewarticle/angular-2.0-and-http

  • 问题是:我们如何在不使用http的情况下做到这一点? (3认同)