使用 Angular 中的 put 调用更新本地 JSON 文件的单个属性 8

Question

我想更新我放在我的资产文件夹中的 JSON 文件，所以如果我只更新我的 JSON 对象的一个属性那么它应该更新那个仅属性，不影响任何其他属性值：

让示例代码为：

loginInterface.ts

export interface loginModel {
    Email: string;
    Password: string;
}

login.component.ts

import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { HttpClient } from '@angular/common/http'
import { loginModel } from './loginModel'

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {


  private _jsonURL = 'assets/Login.json';
  private login: Array<loginModel>;

constructor(
    private http: HttpClient) {
    this.login = new Array<loginModel>();
  }
ngOnInit() {
    this.getLoginData();
  }

  getLoginData() {
    this.http.get<loginModel[]>(this._jsonURL).subscribe(data => {
      this.login = data;
      console.log(this.login);
      return this.login;
    });
  }

UpdateLoginData() {
// How to proceed on this one??
  }
}

login.component.html

<div *ngFor = "let log of login">
    {{log.Email}} 
    <input [ngModel]="log.Password">
</div>
<button (click)="UpdateLoginData()">Update</button>

这只是一个例子。

因此，如果我在一个地方更改密码并单击更新按钮，那么它应该只更新该特定电子邮件的密码，我不想用新的 JSON 对象替换整个文件对于更新单个值，这可能吗？

Answer 1

您不能直接通过 angular 更改 JSON 文件的内容，您需要后端才能在 JSON 文件上反映更改。

Answer 2

没有！您不能使用 Angular 更改文件的内容。它是由具有文件系统 API 的后端 framework/language（例如 Node.JS）处理的文件 I/O 操作。您可以创建一个 RESTful API 来修改文件的内容并从 Angular.

进行 HTTP 调用

Answer 3

您不能仅使用 angular 框架进行任何文件操作。您需要服务器端实现来实现这一点。如果您不熟悉服务器端编程，您可以尝试使用内存 angular 数据库 api.

https://www.npmjs.com/package/angular-in-memory-web-api

Answer 4

在 json 服务器中，您可以使用 put 方法进行更新

//有点像下面给出的

this.http.put(this._jsonURL+this.login[0].id,this.login[0]).subscribe();

使用 Angular 中的 put 调用更新本地 JSON 文件的单个属性 8

Update a single property of local JSON file using put call in Angular 8

javascript

typescript

angular

angular-httpclient

使用 Angular 中的 put 调用更新本地 JSON 文件的单个 属性 8

Update a single property of local JSON file using put call in Angular 8

javascript

typescript

angular

angular-httpclient

使用 Angular 中的 put 调用更新本地 JSON 文件的单个属性 8