无法将类型\'Observable <{}> \'分配为键入角度2

MD ABDULLAH AL KAFI 发表于 Dev

MD ABDULLAH AL KAFI

Observable无法设置，我的package.json文件保存

"angular2": "2.0.0-beta.17",
"systemjs": "0.19.24",
"es6-promise": "^3.0.2",
"es6-shim": "^0.35.0",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.6",
"zone.js": "0.6.12"

问题出现在我的终端开始编译时，它向我显示错误消息

信息：

'\ u001b [31mresources / assets / typescript / services / user.service.ts（25,5）：\ u001b [39merror TS2322：类型''Observable <{}> \'不能分配给类型''Observable \'。 \ n不能将类型\'{} \'分配给类型\'User [] \'。\ n类型\'{} \'中缺少属性\'length \'。}

在我的服务组件中，this.loggedUser $无法由构造函数内部的新Observable初始化，并且破坏了整个过程。

这是我的服务内容

import {Injectable} from 'angular2/core';
import {Http,Response,Headers} from 'angular2/http';

import {Observable} from 'rxjs/Observable';
import {Observer} from 'rxjs/Observer';
import 'rxjs/add/operator/share';
import 'rxjs/add/operator/map';
import {User} from '../interfaces/interfaces';
export var API_ENDPOINT = 'http://localhost:8080/api';


@Injectable()
export class UserService {

  loggedUser$: Observable<User[]>; 
  private loggedUserObserver: Observer<User[]>;
  private loggedUserInfo:{
        users: User[]
    };

  constructor(private _http: Http) {
    this.loggedUser$ = new Observable(observer => this.loggedUserObserver = observer).share();
    this.loggedUserInfo = { users: [] };
  }


    getLoggedUser(){
      return this._http.get(API_ENDPOINT+'/getLoggedUser')
      .map((res:Response)=>res.json())
      .subscribe(
        data => { 
        this.loggedUserInfo.users = data;
        this.loggedUserObserver.next(this.loggedUserInfo.users);
        },
        err => console.error(err),
        () => console.log(this.loggedUserInfo.users)
      );
    }


}

在我的界面中

export interface User {
    id?: number,    
    name?: string,
    email?:string,
    email2?: string,
    password?: string,
    mobile?: string,
    profilePicture?:string,
    userTimeZone?: string
}

如果我在构造函数中放置一个类型，例如

this.loggedUser$ = new Observable<User[]>(observer => this.loggedUserObserver = observer).share();

然后在应用程序组件上向我显示了一个不同的错误，该错误没有出现在终端上，而是出现在控制台上，这是例外：TypeError：_this.loggedUserObserver未定义

import {Component,OnInit,} from 'angular2/core';
import {Router,ROUTER_DIRECTIVES} from 'angular2/router';
import {RouteConfig, RouteData} from 'angular2/router';

import {MyProfileComponent} from './settings/my-profile.component';
import {MyCompaniesComponent} from './company/my-companies.component';
import {MyTasksComponent} from './tasks/my-tasks.component';
import {UserComponent} from './user/user.component';

import {Observable} from 'rxjs/Observable';
import 'rxjs/Rx';
import {UserService} from './services/user.service';
import {User} from './interfaces/interfaces';


@Component({
    selector: 'my-app',
    //templateUrl: 'appView/front.html',
    template:`{{loggedUser.name}}`,
    directives:[ROUTER_DIRECTIVES, MyProfileComponent, MyCompaniesComponent,UserComponent],
    providers: [UserService],


})

export class AppComponent{  
    loggedUser: Observable<User[]>;
    loggedUserInfo:User;
    constructor (private _userService: UserService){    
    }


    ngOnInit(){
        this.loggedUser = this._userService.loggedUser$;
        this._userService.getLoggedUser();
    }
}

MD ABDULLAH AL KAFI

搜索了很多，＃majodi的评论也提供了帮助。在service.ts中，我已经像这样初始化了我的变量

loggedUser$: Observable<User[]>;  
loggedUserObserver: Observer<User[]>;
loggedUserInfo:User[];

并在服务构造函数中

constructor(private _http: Http) {
    this.loggedUser$ = new Observable<User[]>(
      observer => {
      this.loggedUserObserver = observer;
    }
    ).share();
}

在app.component.ts文件中，我这样称呼我的observable

ngOnInit(){     
    this._userService.loggedUser$.subscribe(latestData => {
       this.loggedUserInfo1 = latestData;

    });      
    this._userService.getLoggedUser(); 
}

这些解决了问题。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。