首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Post和Put在Angular2中

Post和Put在Angular2中
EN

Stack Overflow用户
提问于 2017-08-24 11:17:55
回答 1查看 48关注 0票数 1

我需要一些帮助。我正在构建一个图书馆应用程序.I需要从服务器获得图书,标题和作者的列表,并能够更新和插入到服务器上的数据库中的新书。Get方法运行良好,我得到了所有信息的列表,但是pust方法由于这个错误而无法工作。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
POST http://localhost:3002/app/components/bookdata/dbooks.json 404 (Not 
Found)



import {Injectable} from '@angular/core';
import {Http,Response} from '@angular/http';
import {Headers} from '@angular/http';
import 'rxjs/add/operator/map';
import {RequestOptions} from  '@angular/http';

@Injectable()
export class BookService  {
public _url:string="app/components/bookdata/dbooks.json";

constructor(private _http:Http){}
getBooks(){

    return this._http.get(this._url)
    .map((res:Response)=>res.json());
}

insertNewBook(book:Book){



            let body=JSON.stringify(book);
            let headers=new Headers({'Content-Type':'application/json'});
            let options=new RequestOptions({headers:headers});
            this._http.post(this._url,body).subscribe();


       //  .map((res:Response)=>res.json());


    }
        }




export interface Book{
id:number;
Author:string;
Date:string;
Title:string;
}

这就是我发送它的方式

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 import{Component,OnInit} from '@angular/core';
 import {Book} from '../services/book.service'
 import {Injectable} from '@angular/core';
 import {Http,Response} from '@angular/http';
 import {BookService} from '../services/book.service';
 import 'rxjs/add/operator/map';

 @Component({
 selector:'newBook',
 template:`
            <div>

            <div>
                <label for="Author">Author:</label>
                <input type="text" id="au" #au>
        </div>

        <div>
        </div>
        <div>

        <label for="Date">Date:</label>
        <input type="text" id="da" #da>
</div>

<div>
<label for="Titl">Title:</label>
<input type="text" id="ti" #ti>
</div>
<button (click)="InsertData(au.value,da.value,ti.value)">Create</button>
</div>

`

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 })
export class NewBookComponent  {
 book:Book;
static num:number;

constructor(private _bookService:BookService){
    NewBookComponent.num=10;
}

InsertData(au:string,da:string,ti:string){

   let book:Book={id:NewBookComponent.num++,Author:au,Date:da,Title:ti};


                 this._bookService.insertNewBook(this.book);
             //.subscribe(res=>console.log(res));


}

}
EN

回答 1

Stack Overflow用户

发布于 2017-08-24 11:33:00

这对你不起作用的原因是因为你没有发布到API,你正在写的显然只是一个静态文件。当你只用一个get请求调用你的应用程序中的url时,它就足够聪明了,可以把json返回给你,但是它不够聪明,不能用它做任何其他的事情。

如果要通过POST请求修改文件,则必须使用服务器端技术来编写API,在该服务器上托管文件,并根据请求对其执行传统的文件操作。在node中,这里是如何modify a file,下面是如何在node中构建API的示例。(Node,如果你不熟悉,是一种javascript服务器端语言,如果你熟悉angular,你很快就能学会它)

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45860230

复制
相关文章

相似问题

领券
社区富文本编辑器全新改版!诚邀体验~
全新交互,全新视觉,新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能,全面提升创作效率和体验
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文