无法使用可观察对象分配给服务局部变量

Question

总结

我试图通过将 JobService jobs:Job[] 变量分配给请求结果来将 HTTP 结果缓存到局部变量中。然后我希望过滤从另一个注入 JobService.

的组件调用 setSearch() 函数的结果

当 UserService 检索用户时，JobService 订阅事件并获取作业。这意味着如果用户状态发生变化，作业数组也会发生变化。然后调用 setJobs() 来设置本地 jobs 变量

稍后当用户在搜索框中键入内容时，将调用 setSearch() 并且 this.jobs 是一个空数组，即使它是在 setJobs()

中设置的

然后 jobsPublisher 将这组新工作发布给订阅者。

注意：HttpCacheService与Http非常相似，但它只是将响应映射到所需的对象，同时处理和记录错误。

工作服务

@Injectable()
export class JobService {
    jobsPublisher: BehaviorSubject<Job[]>
    private jobs: Job[] = []

    constructor(
        private http: HttpCacheService<Job[]>,
        private userService: UserService,
        private searchService: SearchService
    ) {
        this.jobsPublisher = new BehaviorSubject<Job[]>(this.jobs)

        this.userService.userPublisher.subscribe((user: User) => {
            this.getJobs()
        })
    }

    private getJobs(): void {
        let req = this.http.GET("/d/jobs").subscribe(jobs => {
            this.setJobs(jobs) // jobs = Array(100)
            this.jobsPublisher.next(jobs)
            req.unsubscribe()
        })
    }

    private setJobs(jobs) {
        console.log("Setting jobs!")
        this.jobs = jobs // this.job = jobs = Array(100)
    }

    setSearch(query: string) { // this.jobs = []
        let newJobs = this.filterJobs(query, this.jobs)
        console.log(`Job Length Filter [${this.jobs.length}] -> [${newJobs.length}]`)
        this.jobsPublisher.next(newJobs)
    }

    private filterJobs(query: string, jobs: Job[]): Job[] {
         // Filter jbos
    }
}

JobListComponent

export class JobsListComponent implements OnInit {
  public jobrows: Array<Array<Job>> = []

  constructor(private jobService: JobService, private searchService: SearchService) { }

  ngOnInit() {
    this.jobService.jobsPublisher.subscribe((jobs: Job[]) => {
      this.genRows(jobs)
    })
  }

  private genRows(jobs: Array<Job>): void {
    this.jobrows = []
    while (jobs.length > 0) 
      this.jobrows.push(jobs.splice(0, 3))
  }

  search(event: any): void {
    this.jobService.setSearch(event.target.value || "")
  }
}

Not working

Working as expected

Answer 1

  private genRows(jobs: Array<Job>): void {
    jobs = jobs || []
    this.jobrows = []
    while (jobs.length > 0) 
      this.jobrows.push(jobs.splice(0, 3))
  }

是您更改数组的罪魁祸首。

将其转换为：

          this.jobrows.push(jobs.slice(0, 3))

无法使用可观察对象分配给服务局部变量

Cannot assign to a services local variable using observables

rxjs

angular2-services

angular2-observables

angular

总结

工作服务

JobListComponent