Question

所有

尝试绑定到模型上的函数时出现错误

我有以下组件，模型＆amp; Html（这个例子都是假的）

export class TestModel {    
  public getSomeValue(): string {
     return "Hello World";
  }
}

让我们假设testModels属性以某种方式获取它的数据。

@Component(...)
public class MyComponent {    
  public testModels: TestModel[];

  ngOnInit() {
    this.loadData();
  }

  public loadData(): void
  {
     this.http.get("...")
     .map(r=>r.json as TestModel[]) // <--- I think now you've asked the question, I see the problem on this line
     .subscribe(d=>this.testModels = d);

  }
}

现在在我的HTML中

<div *ngFor="let testModel of testModels">
  <span>{{testModel.getSomeValue()}}</span> <!-- This fails -->
</div>

这是完整的错误：

error_handler.js：48 EXCEPTION：错误 ./MyComponent类MyComponent-内联模板：94：56由： self.context。$ implicit.getSomeValue不是函数

是不是可以绑定到.getSomeValue()或者我做错了吗？

我假设基于这个self.context.$implicit.它会以某种方式失去它的上下文而不是在模型上调用方法，而是试图在“它是自我”上调用它什么呢？

由于

取值

编辑：添加代码以显示如何实例化testModels

Answer 1

as TestModel[]不会使其成为TestModel。它只是告诉typescript编译器（和linter）它可以安全地假设r.json是TestModel[]。

另见JSON to TypeScript class instance?

Answer 2

你可以在你的打字稿类中添加一个getter

export class Person {
    firstname: string;
    lastname: string;
    get name(): string {
        return `${this.firstname} ${this.lastname}`;
    }
}

Angular 2模型函数插值 - self.context。$ implicit.X不是函数

2 个答案: