Как сохранить данные на сервере JSON - PullRequest
Новая
       33

Как сохранить данные на сервере JSON

0 голосов
/ 26 октября 2018

У меня есть простое угловое приложение 6, где у меня есть кнопки Like и Dislike, я хотел бы сохранить данные в JSON Sever (использую в качестве макета) У меня нет API,

Вот что япока что есть

HTML: 

<div class="container">
  <div class="row">
    <p class="col">{{numberOfLikes}}</p>
    <button class="col btn btn-success" (click)="likeButtonClick()">Like</button>
    <button class="col btn btn-danger" (click)="dislikeButtonClick()">Dislike</button>
  </div>

</div>

Машинопись: 

import { Component, Input } from '@angular/core';

@Component({
  selector: 'like-box',
  templateUrl: 'like.component.html',
  styleUrls: [ './like.component.css' ]
})
export class LikeComponent  {
  numberOfLikes : number = 0;

  likeButtonClick() {
    this.numberOfLikes++;
  }

  dislikeButtonClick() {
    this.numberOfLikes--;
  }
}

services.ts: 

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import {Status } from '../model/statuses.model';
@Injectable({
  providedIn: 'root'
})
export class UserService {
   status: Status[];
  constructor(private http: HttpClient) { }
  statusUrl = 'http://localhost:3000/statuses';

  getStatuses() {
    return this.http.get<Status[]>(this.statusUrl);
  }

  addStatus(){
  }
}

JSON: 

{
  "statuses": [
    {  
       "id": 1,
      "likes": 121,
      "following": 723,
      "followers": 4433
    }
  ],
}

Вот ссылка на stackblitz: исходный код

Я знаю, как получить данные из форм, используя formBuilder, но сейчас я стек,

Iхотите, когда пользователь нажимает кнопку лайка, лайки должны быть сохранены на сервере json и отображены на первой странице.сейчас просто отображает, потому что я не знаю, как сохранить сгенерированные лайки в json

Может кто-нибудь помочь?

1 Ответ

0 голосов
/ 26 октября 2018

Вы не можете сделать это с фиктивным сервером, вам нужен настоящий apis.Затем вы можете позвонить this.http.post(this.statusUrl, newStatusObject), чтобы создать новый объект статуса на реальном сервере.

РЕДАКТИРОВАТЬ С помощью json-сервера вы можете это сделать, но вам нужно обновить свой json.Просто добавьте поле Id в статус: 

{
  "statuses": [
   {
     "id": 1
     "likes": 121,
     "following": 723,
     "followers": 4433
    }
  ],
}

Затем вы обновите его следующим образом: 

  const newLikes = { likes: 122 };
  this.http.patch(this.statusUrl, newLikes). subscribe (...

`

...