Angular 无法使用Observable分配给服务局部变量 总结

我试图通过将

JobService

jobs:Job[]

变量分配给请求的结果，将HTTP结果缓存到本地变量中。然后，我希望从另一个注入

JobService

的组件中过滤调用

setSearch（）函数的结果

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

稍后，当用户在搜索框中键入时，将调用
setSearch（）
，并且
this.jobs
是一个空数组，即使它是在
setJobs（）中设置的

jobsupblisher
然后将这组新作业发布给订阅者

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

就业服务
@Injectable（）
出口类就业服务{
求职者：行为主体
私人职务：职务[]=[]
建造师(
专用http:HttpCacheService，
私有用户服务：用户服务，
私人搜索服务：搜索服务
) {
this.jobsublisher=新行为主体（this.jobs）
this.userService.userPublisher.subscribe（（用户：用户）=>{
这是getJobs（）
})
}
私有getJobs（）：void{
让req=this.http.GET（“/d/jobs”）.subscribe（jobs=>{
this.setJobs（jobs）//jobs=Array（100）
this.jobsupblisher.next（作业）
请求取消订阅（）
})
}
私人设置作业（作业）{
log（“设置作业！”）
this.jobs=jobs//this.job=jobs=Array（100）
}
setSearch（query:string）{//this.jobs=[]
让newJobs=this.filterJobs（查询，this.jobs）
log（`Job Length Filter[${this.jobs.Length}]->[${newJobs.Length}]`）
this.jobsupblisher.next（newJobs）
}
私有筛选器作业（查询：字符串，作业：作业[]）：作业[]{
//过滤jbos
}
}

作业列表组件
导出类JobsListComponent实现OnInit{
公共作业行：数组

问题是什么，您是否遇到了错误？您期待什么以及发生了什么。理想情况下，您不应该在中使用
subscribe
services@Skeptor当
setSearch（）时
被调用，这个.jobs是一个空数组。你能说明你是如何从组件调用服务的吗。@Skeptor我添加了组件filterJobs的实际内容是什么？因为它现在在你给出的代码中只是一个注释。它实际上是你代码中的一个注释吗？如果不是，请放入适当的代码，这样我们就不需要了“我不必假设你做的事情是正确的。谢谢你的这些建议@Ced。是的，这是一个奇怪的问题，不知道发生了什么。我正在制造一个陷阱，因为如果它在那里起作用，你会非常恼火。当然，它起作用了。我不知道为什么它不在我的项目中起作用。”though@Cred所以我做了一个包含服务器等的回购协议：我还试着看看你建议的getter和setter实现有任何不同，但它没有：（@Harry我不是说它会有不同，我是说它会帮助你解决问题。如果你想要更多的帮助，我建议你使用角度gitter。
@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
    }
}

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 || "")
  }
}

  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))