Question

我尝试为country-detail.component.ts组件创建访问数据的共享服务。我得到错误。我无法从countrydetail组件访问数据。如何解决这个问题？

country-detail.component.ts（31,44）：类型'（）=＆gt;上的属性'subscribe'不存在可观察到的”。）

countries.services.ts

  import { Injectable } from '@angular/core';
  import { Http, Response } from '@angular/http';
  import { Observable } from 'rxjs/Observable';
  import { environment } from 'environments/environment';
  import 'rxjs/Rx';
  import 'rxjs/add/operator/map';

  import {Countries} from '../countries';

  @Injectable() 

  export class CountriesService {

    constructor(private http: Http) {}

    Countries:Countries;

    getCountries() {
       if ( this.Countries) { 
        return Observable.of(this.Countries); 
      } else { 
       return this.http.get(environment.ApiEndPointURLGetCities)
        .map(this.extractData);
      }
    }

    private extractData(res: Response) {      
      let Countries = res.json();   
      return Countries || { };
    }

  }

  export interface Countries {
    Status: Number;
    msg: String;
    categorylist: any[];
  }

国家detail.component.ts

import { Component, OnInit }      from '@angular/core';
import { Router,ActivatedRoute, Params } from '@angular/router';

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

import { CountriesService }  from '../services/countries.services';

@Component({
  moduleId: module.id,
  selector: 'app-root',
  templateUrl: 'country-detail.component.html',
  styleUrls: [ './country-detail.component.css' ],
  providers:[CountriesService],
})


export class CountryDetailComponent implements OnInit {  
    public edited = true;      
    offset = 100;
    errorMessage: string;

    constructor(
       private _CountriesService: CountriesService            
    ) { 

       this._CountriesService.getCountries.subscribe((observer) => {
        console.log('Subscribe component', JSON.parse(observer._body));
      });
    }

    ngOnInit(): void {      

    } 
}


export interface Cities {
  Status: String;
  msg: String;
  categorylistvalues: any;
}

Ngmodule

  @NgModule({
      imports: [   
        BrowserModule,
        FormsModule,    
        AppRoutingModule,
        HttpModule,
        ModalModule,    
        NgbModule.forRoot(),   

      ],
      declarations: [
        AppComponent,    
        HomepageComponent,
        HeaderComponent,
        FooterComponent,    
        CountryDetailComponent,   
      ],

      providers: [ CitiesService, ModalBackdropComponent,CountriesService,Title,  
        { provide: APP_BASE_HREF, useValue: window['_app_base'] || '/' },
        ],
      bootstrap: [ AppComponent]


    })
    export class AppModule { }

的console.log

Answer 1

它应该

providers

getCountries是方法，而不是属性

<强>更新将您的服务放在@NgModule装饰的int dayOfMonth = cal.get(Calendar.DAY_OF_MONTH + i);数组中。

共享服务不工作在角度2

1 个答案: