Question

在我的组件中，我有一个持有对函数引用的对象。但是，当我将其传递给组件的HTML并执行时，它无法访问函数范围之外的任何其他属性。有什么办法可以使这项工作成功？

这是我的代码：

button =  {label: 'My action', action: this.doStuff }
doStuff(){
if(this.userService.IsUserLoggedIn){ // Cannot read property 'IsUserLoggedIn' of undefined
//do stuff
}
}

<button (click)="button.action()">{{button.label}}</button>

我尝试添加一个将this绑定到函数的附加函数，但没有成功。

<button (click)="exec(button.action)">{{button.label}}</button>

exec(func: Function){
func.bind(this);
func();
}

很抱歉有任何错误

Answer 1

那是因为在声明按钮对象时必须绑定上下文：

button = { label: 'My action', action: this.doStuff.bind(this) }

Stackblitz

（我创建了obj.condition，以便在删除.bind(this)时看到类似的错误）

传递给组件的HTML时，方法没有上下文

1 个答案: