Question

我一直在学习Angular，到目前为止，我已经掌握了基础知识。我想更深入地研究RxJS和Observables，但每次我尝试在线跟踪教程时，总会出现这些微不足道的错误，我觉得很愚蠢，我无法解决它们，并且陷入这些教程的第一步。例如，我正在关注Rindle.io关于Observables的教程，但.next(42) .next(43)和.push(value)返回错误Argument of type '42' is not assignable to paramter of type 'number[]'。

在一些教程和RxJS官方GitHub中，他们使用import Rx from 'rxjs/Rx'或import * Rx from 'rxjs'Rx，但它在我的项目中不起作用。无法弄清楚为什么我必须使用import { Observable } from 'rxjs/Observable'而不是导入所有内容。

无论如何，我错过了什么导致操作员出错？

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

import { Observable } from 'rxjs/Observable';
import 'rxjs/observable/from';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';

  private data: Observable<Array<number>>;
  private values: Array<number> = [];
  private anyErrors: boolean;
  private finished: boolean;

  constructor() {}

  init() {
    this.data = new Observable(observer => {
      setTimeout(() => {
        observer.next(42);
      }, 1000);

      setTimeout(() => {
        observer.next(43);
      }, 1000);

      setTimeout(() => {
        observer.complete();
      }, 3000);
    });

    const subscription = this.data.subscribe(
      value => this.values.push(value),
      error => this.anyErrors = true,
      () => this.finished = true
    );
  }
}

Answer 1

您看到的错误是因为您声明Observable会生成Array<number>类型的元素，但您将其设置为生成number值。

如果你改变了

private data: Observable<Array<number>>;

到

private data: Observable<number>;

应解决您的问题。

请记住，Observables应设置为它们将发出的每个对象的类型，例如<number>，而不是像<Array<number>> *

这样的排放列表或集合

*当然，除非您的observable实际上每次都发出一组对象......

Answer 2

这里有一个有效的Plunker：http://plnkr.co/edit/SA25mG?p=preview

它只有两个导入：

import {Component} from '@angular/core';
import {Observable} from 'rxjs/Observable';

你没有显示HTML，所以我假设你有类似于这个plunker的东西？

无法使基本的Observable工作

2 个答案: