Angular 4 - сохранение из HTML-шаблона в макет JSON DB

Question

Приложение Angular 4, у меня есть входные текстовые поля, где значения должны быть сохранены из шаблона в данные JSON, которые я использую в качестве фиктивной БД. Я написал службы и функцию сохранения ниже, но не смог сохранить их в файле.json. Идея или помощь, чтобы заставить это работать.

<ng-container *ngFor="let data of displayReasonCodes$ | async;let i = index">
<tr class= "row-break">
 <td>  
    <form>
    <form-group>
  <textbox [readOnly]="isEditable" ngModel="{{data .ReasonCode}}"  name="textbox" ></textbox>
        </form-group>
</form>
</td>
<td>
<form>
<form-group>
 <textbox  [readOnly]="isEditable" ngModel="{{data .Description}}" name="textbox1" ></textbox>
</form-group>
 </form>
  </td>

services.ts
@Injectable()


export class CodesService{ 
    constructor(private httpClient:HttpClient, private apiUrlService : ApiUrlService){}

createReasonCodes(data:IReasonCodes){
        var url = this.apiUrlService.getPostfix("/Codes");
        return this.httpClient.post<IPostHttpResponse>(url,codes);
    }

   COMPONENT.TS
save(){

  let newreasoncodeDefinition: IReasonCodes = this.poolModel.get();

  this.rCodesActions.createCodes(newreasoncodeDefinition).
  subscribe(definitionResponse => {
    if(definitionResponse.responseCode ===1 ){
      console.log("The ReasonCode " + newreasoncodeDefinition.ReasonCode + "Created Successfully");

    }
  })


} 

ReasonCode fromUIModel.ts

poolModel: ReasonCodeFormUIModel;
ngOnInit (){
      this.poolModel = new ReasonCodeFormUIModel();

public get() :IReasonCodes {
    let reasonCodes = new ReasonCodes();
    reasonCodes.Code= this.reasoncode;
    reasonCodes.Description = this.description;
return reasonCodes;
}
}

Answer 1

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

Насколько я знаю, это невозможно. Вы не можете обновить локальный файл JSON. Если вы хотите смоделировать базу данных get/post/put, вместо этого вы можете рассмотреть возможность использования веб-API Angular Inmemory: https://github.com/angular/in-memory-web-api

Это было настроено специально для этой цели... чтобы издеваться над внутренним сервером без необходимости использовать внутренний сервер.

Большинство моих примеров приложений используют его.

Вы можете увидеть это в действии в документации по Angular здесь: https://angular.io/tutorial/toh-pt6