javascript - RxJS Observable :'Skip is not a function'(或任何其他函数)

标签 javascript angular rxjs

我在使用 RxJS 时遇到一个奇怪的错误,得到“方法不是函数”。

我确实导入了 Observable 库。 我已经得到 Observable 数组,没有出现任何错误。

但是当我跳过或接受时,我得到这个错误。

如果我没看错:

Returns an Observable that skips the first count items emitted by the source Observable.

由于我的 Observable 包含 Article,它应该跳过 Observable 上的 x Article 对吗?

这是代码

import { Component, OnInit } from '@angular/core';
import { Article} from '../../model/article';
import {  ArticleService} from '../../model/article.service';
import { Router } from '@angular/router';

import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

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

  articles: Observable<Article[]>;
  articlesPage: Observable<Article[]>;
  selectedArticle: Article;
  newArticle: Article;
  page = 1;
  itemPerPage = 2;
  totalItems = 120;

  constructor(private router: Router, private articleService: ArticleService) {

  }


  ngOnInit() {
    this.articles = this.articleService.getArticles();
    this.articlesPage = this.articles.skip((this.page - 1) * this.itemPerPage ).take(this.itemPerPage);

    //this.articlesPage = this.articles.slice(  (this.page - 1) * this.itemPerPage , (this.page) * this.itemPerPage );

  }
  onSelect(article: Article) {
    this.selectedArticle = article;
    this.router.navigate(['../articles', this.selectedArticle.id ]);
  }
  onPager(event: number): void {
    console.log('Page event is' , event);
    this.page = event;
    this.articlesPage = this.articles.skip((this.page - 1) * this.itemPerPage ).take(this.itemPerPage);

    console.log('tab' , this.articlesPage.count());
    //this.articleService.getArticles().then(articles => this.articles = articles);

  }

  getArticles(): void {
    this.articles = this.articleService.getArticles();
  }
  createArticle(article: Article): void {

    //this.articleService.createArticle(article)
      //.then(articles => {
       // this.articles.push(articles);
       // this.selectedArticle = null;
      //});
  }

  deleteArticle(article: Article): void {
    //this.articleService
     // .deleteArticle(article)
     // .then(() => {
      //  this.articles = this.articles.filter(b => b !== article);
      //  if (this.selectedArticle === article) { this.selectedArticle = null; }
      //});
  }
}

我试图将它直接与 .skip(1) 一起使用,但得到了同样的错误。

我查了官方文档RxJS Observable我觉得还可以。看来情况还可以,因为我调用了函数。两个 arryas 都是 Observable,所以我应该能够在一个上使用这些函数,然后将结果放在另一个上,对吧?

我看不出这里有什么问题,可能是一个小细节,但我自己看不到(因为我从这里开始,我看到的细节较少)。

最佳答案

您需要导入 skiptake,就像导入 mapcatch 一样>.

import 'rxjs/add/operator/skip';
导入 'rxjs/add/operator/take';

关于javascript - RxJS Observable :'Skip is not a function'(或任何其他函数),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45977904/

相关文章:

javascript - 如何使用下划线模板编写条件 if 语句

javascript - 在构造函数中使用 "this"

node.js - res.redirect() cors在MEAN应用程序中不起作用

angular - 使用 RxJS 刷新/重新加载 Hot Observable 序列

typescript - 开玩笑 mock rxjs 的 lastValueFrom

angular - 可以从异步管道调用类方法吗?

javascript - 循环内第一个 div 的弹出内容

javascript - 无法将长 json 保存到 Internet Explorer 11 中的文件

selenium - Protractor : Error while waiting for Protractor to sync with the page: "Could not find testability for element."

typescript - ag Grid 使用 angular 和 typescript 搜索数据