Function

map (dependentKey, additionalDependentKeys, callback) ComputedProperty public

Module:	@ember/object

Defined in packages/@ember/object/lib/computed/reduce_computed_macros.js:309

import { map } from '@ember/object/computed';

dependentKey

String

additionalDependentKeys

Array

optional array of additional dependent keys

callback

Function

returns

ComputedProperty

an array mapped via the callback

Returns an array mapped via the callback

The callback method you provide should have the following signature:

• item is the current item in the iteration.
• index is the integer index of the current item in the iteration.

function mapCallback(item, index);

Example:

import { set } from '@ember/object';
import { map } from '@ember/object/computed';

class Hamster {
  constructor(chores) {
    set(this, 'chores', chores);
  }

  @map('chores', function(chore, index) {
    return `${chore.toUpperCase()}!`;
  })
  excitingChores;
});

let hamster = new Hamster(['clean', 'write more unit tests']);

hamster.excitingChores; // ['CLEAN!', 'WRITE MORE UNIT TESTS!']

Classic Class Example:

import EmberObject from '@ember/object';
import { map } from '@ember/object/computed';

let Hamster = EmberObject.extend({
  excitingChores: map('chores', function(chore, index) {
    return `${chore.toUpperCase()}!`;
  })
});

let hamster = Hamster.create({
  chores: ['clean', 'write more unit tests']
});

hamster.excitingChores; // ['CLEAN!', 'WRITE MORE UNIT TESTS!']

You can optionally pass an array of additional dependent keys as the second parameter to the macro, if your map function relies on any external values:

import { set } from '@ember/object';
import { map } from '@ember/object/computed';

class Hamster {
  shouldUpperCase = false;

  constructor(chores) {
    set(this, 'chores', chores);
  }

  @map('chores', ['shouldUpperCase'], function(chore, index) {
    if (this.shouldUpperCase) {
      return `${chore.toUpperCase()}!`;
    } else {
      return `${chore}!`;
    }
  })
  excitingChores;
}

let hamster = new Hamster(['clean', 'write more unit tests']);

hamster.excitingChores; // ['clean!', 'write more unit tests!']

set(hamster, 'shouldUpperCase', true);
hamster.excitingChores; // ['CLEAN!', 'WRITE MORE UNIT TESTS!']