angular - 调用组件函数时，self.context 不是 Angular2 中的函数

我想在实例化 angular2 组件时调用一个函数，但出现以下错误:
类型错误:self.context.dummyFunc 不是函数

下面是一个人为的例子，但会告诉你我的问题。
假设我们有以下组件:

import { Component } from '@angular/core';

    @Component({
      selector: 'myItem',
      template: `<div>This will work->{{dummyFunc()}}</div>`,
    })
    export class myItemComponent {
      constructor() { }

      dummyFunc() :string {
        return "bold";
      }
    }

以及以下 HTML:
<ul myItem [ngClass]='dummyFunc()'></ul>
将产生以下异常:



如果我将 HTML 更改为:
<ul myItem></ul>
该组件运行并能够调用内部的 dummyFunc 函数
<div>
我假设在组件myItem的上下文中不调用dummyFunc()，而是在实例化myItem的组件中调用。

我的问题。实例化组件时，在刚刚创建的组件上调用函数的正确方法是什么？

最佳答案

事实上，当你在 dummyFunc 元素上使用 ul 时，你是在 myItem 组件之外。所以你不能使用它。您只能访问与当前模板关联的组件的属性和方法。

如果要使用此模板中使用的组件的方法，则需要先引用它。您可以尝试以下操作:

<ul #comp myItem [ngClass]="comp.dummyFunc()"></ul>

关于angular - 调用组件函数时，self.context 不是 Angular2 中的函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38825254/