Function

invokeHelper (context, definition, computeArgs) public

Defined in packages/@ember/helper/index.ts:251

import { invokeHelper } from '@ember/helper';

context

Object

The parent context of the helper

definition

Object

The helper definition

computeArgs

Function

An optional function that produces args

returns

The invokeHelper function can be used to create a helper instance in JavaScript.

To access a helper's value you have to use getValue from @glimmer/tracking/primitives/cache.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

// app/components/data-loader.js
import Component from '@glimmer/component';
import { getValue } from '@glimmer/tracking/primitives/cache';
import Helper from '@ember/component/helper';
import { invokeHelper } from '@ember/helper';

class PlusOne extends Helper {
  compute([number]) {
    return number + 1;
  }
}

export default class PlusOneComponent extends Component {
  plusOne = invokeHelper(this, PlusOne, () => {
    return {
      positional: [this.args.number],
    };
  });

  get value() {
    return getValue(this.plusOne);
  }
}

1

{{this.value}}

It receives three arguments:

• context: The parent context of the helper. When the parent is torn down and removed, the helper will be as well.
• definition: The definition of the helper.
• computeArgs: An optional function that produces the arguments to the helper. The function receives the parent context as an argument, and must return an object with a positional property that is an array and/or a named property that is an object.

And it returns a Cache instance that contains the most recent value of the helper. You can access the helper using getValue() like any other cache. The cache is also destroyable, and using the destroy() function on it will cause the helper to be torn down.

Note that using getValue() on helpers that have scheduled effects will not trigger the effect early. Effects will continue to run at their scheduled time.