类型不能分配给类型,类型中缺少属性(错误无法捕获)

时间:2017-08-19 07:48:20

标签: angular typescript

我是打字稿的新手,并且被困在这里4个小时。最后决定发布在这里我的数据是关注的。
data.js

        let links=
[
      {
         "type":"header",
         "title":"Account"
      },

      {
         "title":"Profile",
         "description":"View your profile",
         "url":"http://www.test.com/user/profile/url/here",
      },
      {
         "title":"Board",
         "description":"View your board",
         "url":"http://www.test.com/user/board/url/here",
      },
      {
         "type":"separator"
      },
      {
         "title":"Settings",
         "description":"Manage your settings",
         "url":"http://www.test.com/user/settings/url/here",
      }

];

factory.js

  import { LinkType } from './user-profile.enum';
import {MenuLinkType } from './user-profile.interface';
import {UserService } from '../user.service';
import { PlatformService } from '../platform.service';

abstract class MenuItem implements MenuLinkType {
 abstract get type():LinkType;
}

export  class MenuHeaderItem extends MenuItem  {
    constructor(private _title: string){
        super();
    }
    get type():LinkType {
          return  LinkType.Header;
    }
  get title():string {
    return  this._title;
  }
}

export class MenuSeparatorItem extends MenuItem {
  get type(): LinkType {
    return LinkType.Separator;
  }
}

export class MenuLinkItem extends MenuItem {
    constructor(private title: string, private _url:string, private _description:string){
        super();
    }
  get type(): LinkType {
    return LinkType.Link;
  }
  get title1(): string {
    return  this.title;
  }
  get description(): string {
    return  this._description;
  }
  get url(): string {
    return  this._url;
  }
}

export type MenuItemKind = MenuItem | MenuHeaderItem | MenuSeparatorItem | MenuLinkItem;

我的另一个服务文件是

Intermediate.service.js

  import {Injectable} from '@angular/core';
import { UserService } from '../user.service';
import { MenuItemKind, MenuHeaderItem,MenuSeparatorItem,MenuLinkItem } from './user-profile.factory';
import { Observable } from 'rxjs/Observable';
import  'rxjs/add/operator/map';

@Injectable()
export class UserIntermediateService {
     constructor(private userService: UserService) {
  }
 userDetail(userid):Observable<MenuItemKind>{
 let userRes =   this.userService.getUserDetail(userid);
 let obs = {} as MenuItemKind;
   obs = Object.keys(userRes).map(k => <MenuItemKind>userRes[k]);
    return obs;
  }
}

出现错误: -

  

-intermediate.service.ts(14,4):类型'MenuHeaderItem []'不能指定为'MenuHeaderItem'类型。

     

intermediate.service.ts(15,5):类型'MenuHeaderItem'不能分配给'Observable'类型。     'MenuHeaderItem'类型中缺少属性'_isScalar'。

任何帮助将不胜感激。提前致谢。

1 个答案:

答案 0 :(得分:1)

您将obs声明为MenuItemKind,但您正在尝试为其分配MenuItemKind数组。

let obs = {} as MenuItemKind;
obs = Object.keys(userRes).map(k => <MenuItemKind>userRes[k]);

但请注意,在这种情况下,您不需要声明obs的类型,因为可以推断:

let obs = Object.keys(userRes).map(k => <MenuItemKind>userRes[k]);

您还使用返回类型userDetail声明了函数Observable<MenuItemKind>,但变量obs实际上是MenuItemKind[]类型。