javascript - 全局服务在 angular2 中不起作用

标签 javascript typescript angular angular2-services

我在 angular2 中创建了一个全局服务,用于访问所有组件的变量,如下所示。

global.objects.service.ts

import {Http} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {Observer} from 'rxjs/Observer';
import 'rxjs/add/operator/share';

export class GlobalObjectsService {
  workspace:any;     
  constructor() {    
  }  
}

然后我可以在我的 workspace.component 中访问并为此对象设置新值,如下所示:

import {Component, OnInit,Input} from 'angular2/core';
import { GlobalService} from './../../../app/shared/services/global/global.service';
import { GlobalObjectsService} from './../../shared/services/global/global.objects.service';
import { WorkspaceService } from './../../../app/shared/services/pm/workspaces.service';   

@Component({
    selector: 'workspaces',
    providers:[WorkspaceService],        
    templateUrl: 'app/project-manager/workspaces/workspaces.component.html'
})

export class WorkspacesComponent implements OnInit {
    @Input() workspaces:any;    
    constructor(private globalService:GlobalService,private globalObjectsService:GlobalObjectsService,private workspaceService:WorkspaceService) { }

    ngOnInit() { }    
    selectWorkspace(workspace_id:string){
       this.workspaceService.getWorkspaceById(workspace_id,this.globalService.baseUrl).subscribe((workspace)=>{
           this.globalObjectsService.workspace=workspace; 
           console.log(this.globalObjectsService.workspace);  //this prints workspace correctly        
       });           
    }    
}

但是当我试图在下面的组件中访问这个全局对象时,它显示 undefined

import {Component, OnInit ,Input} from 'angular2/core';
import { GlobalObjectsService} from './../../shared/services/global/global.objects.service';
@Component({
    selector: 'pages',    
    templateUrl: 'app/project-manager/pages/pages.component.html'
})
export class PagesComponent implements OnInit {
    @Input() pages:any;
    public workspace:any;    
    constructor(private globalObjectsService:GlobalObjectsService) {
        this.workspace=this.globalObjectsService.workspace; 
        console.log(this.workspace);  //this is not working           
    }
    ngOnInit() { }        
}

在引导过程中,除根组件外,我没有在任何组件的 providers 中包含 global.objects.service

有什么建议吗?

最佳答案

您的服务缺少 @Injectable() 指令。只需像这样添加它:

import {Injectable} from 'angular/core';
import {Http} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {Observer} from 'rxjs/Observer';
import 'rxjs/add/operator/share';

@Injectable()
export class GlobalObjectsService {
  workspace:any;     
  constructor() {    
  }  
}

阅读更多关于 Angular 2 中的依赖注入(inject) here .

关于javascript - 全局服务在 angular2 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37154882/

相关文章:

mobile - 混合移动应用事件跟踪或分析

javascript - 错误类型错误: Cannot read property 'map' of undefined angular 4

c# - 要再次显示网页,浏览器需要重新发送信息

javascript - 使 float 图像具有相同的边距

javascript - lambda : How can I make this imperative reducer more declarative?

angular - 可以使用另一个 Angular 服务吗?

javascript - 为什么 React 要求在静态 propTypes 中重复使用 props?

javascript - 尝试在 React w/Formik 中每次输入字段完成时创建一个计数器

javascript - res.body 的 TypeScript 类型注解

javascript - 如何制作一种类型取决于参数