Question

我有一个项目列表。我最初拉下来了。这是一个对象数组。然后，我发出请求，检查是否有任何内容从此新端点更改为此数组。如果一个对象已添加到此数组，那么我需要以某种方式显示此数组与添加的对象。所以将新对象插入旧数组。我该怎么做？谢谢！

Answer 1

这种方法可以单独用于Angular，也可以用于Ionic Framework。
您可以使用以其Observables，Subject，BehaviorSubject ...等着称的RxJs库

您需要订阅要监视更改的对象/数据。

我为此示例选择了主题，因此未添加初始值。你可以采用另一种方式做到这一点

watcher = new BehaviorSubject(objArr);

它将以设置为它的objArr = [{}，{}]的值开头。

以下是一个关于如何解决这个问题的简单示例。

＆＃13;

import {AfterContentInit, Component, OnInit} from '@angular/core';
import {Subject} from "rxjs/Subject";

@Component({
  selector: 'app-root',
  styleUrls: ['./app.component.css'],
  template: `
    <h1> Keep watch on new additions to Array </h1>
    <button (click)="addObj({name: 'Doe', age: 30})">Add Object</button>
    <div *ngFor="let item of objArr">
      <ul>
        <li> Name: {{item.name}}, Age: {{item.age}}</li>
      </ul>
    </div>
  `
})

export class AppComponent implements OnInit, AfterContentInit {

  //// lets say it is where the data is coming from and into.
  objArr = [
    {
      name: 'John',
      age: 20
    },
    {
      name: 'Jane',
      age: 21
    }
  ];

  watcher = new Subject();

  constructor() {}

  ngOnInit() {
    this.watcher.subscribe((data: User) => {
      console.log('Array has being modified --> ' , data);
      alert('Array has received new Data')
      this.objArr.push({name: data.name, age: data.age})
    })
  }

  ngAfterContentInit() {
    setTimeout(() => {
      this.watcher.next({name: 'Andy', age: 32})
    }, 3500)


    setTimeout(() => {
      this.watcher.next({name: 'Bob', age: 48})
    }, 6000)
  }

  addObj(data: User) {
    this.watcher.next(data)
  }
}

export interface User {
  name: string,
  age: number
}

＆＃13;

您可以到这里进一步阅读和记录http://reactivex.io/rxjs/
但最重要的是你需要一个Observable / etc来监视流上的文件更改并订阅它接收通知/等。这也是使用EventEmitter在组件之间进行通信的更好方法。 Angular加载了Observable，您可以在其中订阅，例如HttpClient。

祝你好运。

基于布尔值 - 角度2 + /离子2+向数组添加/删除对象

1 个答案: