我有2台服务器,1台使用nodejs,另一台使用gulp-webserver。
node.js服务器使用users.json文件并显示它们。
var express = require("express");
var app = express();
var bodyParser = require("body-parser");
var router = express.Router();
var cors = require('cors')
var fs = require("fs");
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({"extended" : false}));
app.get('/listUsers', function (req, res) {
fs.readFile( __dirname + "/" + "users.json", 'utf8', function (err, data) {
console.log( data );
res.end( data );
});
})
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})
user.json:
{
"user1" : {
"name" : "mahesh",
"password" : "password1",
"profession" : "teacher",
"id": 1
},
"user2" : {
"name" : "suresh",
"password" : "password2",
"profession" : "librarian",
"id": 2
},
"user3" : {
"name" : "ramesh",
"password" : "password3",
"profession" : "clerk",
"id": 3
}
}
现在我想使用get方法调用该数据,并将其存储到变量中,然后使用primeng-datatable显示它。
因此我有一个data.service:
import { Injectable } from '@angular/core';
import { Headers, Http } from '@angular/http';
import { Data } from './data';
import 'rxjs/add/operator/toPromise';
@Injectable()
export class DataService {
constructor(private http : Http) {
}
getData(){
return this.http.get('http://localhost:8081/listUsers')
.toPromise()
.then(res => <Data[]> res.json().data)
.then(data => { return data; });
;}
}
我在我的datacomponent中调用了这个onInit:
import { Component } from '@angular/core';
import { Data } from './data';
import {DataTable} from 'primeng/primeng';
import {Column} from 'primeng/primeng';
import { Headers, Http } from '@angular/http';
import 'rxjs/add/operator/toPromise';
import { DataService } from './data.service'
@Component({
selector: 'my-datatbl',
templateUrl: 'dist/data.component.html',
directives: [DataTable, Column],
providers: [DataService]
})
export class DataComponent {
datatbl: Data[];
constructor(private dataservice : DataService) {
}
ngOnInit(){
this.dataservice.getData().then(datatbl => this.datatbl = datatbl)
console.log(this.datatbl)
consolelog显示未定义。
我不知道哪个错了,但是因为我是一个绝对的新人,我的第一个问题是: 这甚至可能吗?
这仅用于测试目的,因为我正在进入REST apis。我不想在这个阶段使用mongodb或任何其他数据库服务,虽然我可以这样做,如果这是唯一的方法。
答案 0 :(得分:0)
好的,我自己解决了。 问题是,我的响应是指我的users.json的.data属性,显然不存在。所以我只是将users.json改为
{ "data": [
{
"name" : "mahesh",
"password" : "password1",
"profession" : "teacher",
"id": 1
},
{
"name" : "suresh",
"password" : "password2",
"profession" : "librarian",
"id": 2
},
{
"name" : "ramesh",
"password" : "password3",
"profession" : "clerk",
"id": 3
}
]
}
现在一切正常。