首页 > 解决方案 > 上下文。$隐式。不是功能打字稿错误

问题描述

我有以下课程

import { ClassAsset } from './class-asset';

export class Class {
    ClassId:string;
    ClassName:string;
    Assets:ClassAsset[];

    GetAssetsString():string{
        var str:string;
        this.Assets.forEach(a=>{
            str+=a.AssetName;
        });

        return str;
    }

使用以下角度视图代码

<tr *ngFor="let cls of classList">
        <td>{{cls.className}}</td>
        <td>{{cls.GetAssetsString()}}</td>
      </tr>

我的组件看起来像这样

export class ClassesComponent implements OnInit {
  private _client:HttpClient;
  public classList:Class[]=[];

  constructor(client:HttpClient,private route:Router,private datasource:DataService) {
    this._client=client;
   }

  ngOnInit() {
    this.getClasses();
  }

  getClasses()
  {
    this.datasource.getClassList().subscribe((resp:Class[])=>{
      console.log(resp);
      this.classList=resp;}
      );
  }
}

但是我得到了错误

TypeError: _v.context.$implicit.GetAssetsString 不是函数

我究竟做错了什么?(我还在习惯 Typescript ......)

标签: angulartypescript

解决方案


因为您将从服务器收到的响应转换为您的Class对象。很可能它是一个有数据但没有功能的对象。这就是GetAssetsString函数在您的代码中不可用的原因。

话虽如此,您可以像这样在Class对象中创建一个构造函数

export class Class {
    ClassId:string;
    ClassName:string;
    Assets:ClassAsset[];

    constructor(obj?:any){
      this.ClassId= obj && obj.ClassId || '';
      this.ClassName= obj && obj.ClassName || '';
      this.Assets = obj && obj.Assets || [];
    }

    GetAssetsString():string{
        var str:string;
        this.Assets.forEach(a=>{
            str+=a.AssetName;
        });

        return str;
    }
}

你的 getClasses 方法会像这样修改

          getClasses()
          {
            this.datasource.getClassList().pipe(map(response =>
            response.json())).subscribe(x=>{
              this.classList= x.map(x1=>new Class(x1));
              });
          }

谢谢。


推荐阅读