aurelia - 从 View 模型调用自定义属性方法

Question

我有一个带有显示和隐藏一些 HTML 内容的方法的自定义属性，我已将该属性附加到 View 模型中的一个元素。

如何从 View 模型调用自定义属性中定义的方法？

Answer 1

要访问自定义属性的 View 模型，只需将自定义属性第二次放在元素上，但这次将 .ref="viewModelPropertyName" 放在属性上。然后，在父 View 模型中，您可以使用 viewModelPropertyName(或您为其指定的任何名称)访问属性上的方法。您可以在此处查看示例:https://gist.run/?id=9819e9bf73f6bb43b07af355c5e166ad

app.html

<template>
  <require from="./has-method"></require>

  <div has-method="hello" has-method.ref="theAttribute"></div>

  <button click.trigger="callMethod()">Call method</button>
</template>

app.js

export class App {
  callMethod() {
    const result = this.theAttribute.someMethod('blah');
  }
}

有方法.js

export class HasMethodCustomAttribute {
  someMethod(foo) {
    console.log('someMethod called with foo = ' + foo + ', this.value = ' + this.value);

    return `Hello ${foo}`;
  }
}