https://github.com/buschtoens/ember-service-helper

Simple template helper to inject services into templates
https://github.com/buschtoens/ember-service-helper

ember ember-addon ember-helper ember-helpers ember-services ember-template-helper emberjs

Last synced: about 2 months ago
JSON representation

Simple template helper to inject services into templates

• Host: GitHub
• URL: https://github.com/buschtoens/ember-service-helper
• Owner: buschtoens
• License: mit
• Created: 2019-09-13T21:25:41.000Z (over 5 years ago)
• Default Branch: main
• Last Pushed: 2023-12-15T08:26:25.000Z (about 1 year ago)
• Last Synced: 2024-04-09T22:23:38.490Z (9 months ago)
• Topics: ember, ember-addon, ember-helper, ember-helpers, ember-services, ember-template-helper, emberjs
• Language: JavaScript
• Size: 1.97 MB
• Stars: 15
• Watchers: 3
• Forks: 2
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# ember-service-helper

[![CI](https://github.com/buschtoens/ember-service-helper/workflows/CI/badge.svg)](https://github.com/buschtoens/ember-service-helper/actions)

[![npm version](https://badge.fury.io/js/ember-service-helper.svg)](http://badge.fury.io/js/ember-service-helper)

[![Download Total](https://img.shields.io/npm/dt/ember-service-helper.svg)](http://badge.fury.io/js/ember-service-helper)

[![Ember Observer Score](https://emberobserver.com/badges/ember-service-helper.svg)](https://emberobserver.com/addons/ember-service-helper)

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

[![dependencies](https://img.shields.io/david/buschtoens/ember-service-helper.svg)](https://david-dm.org/buschtoens/ember-service-helper)

[![devDependencies](https://img.shields.io/david/dev/buschtoens/ember-service-helper.svg)](https://david-dm.org/buschtoens/ember-service-helper)

Simple template helper to inject services into templates.

## Installation

```sh

ember install ember-service-helper

```

## Usage

There are two ways to invoke the `{{service}}` helper.

- **`{{service serviceName}}`** — Returns the service itself.


  Like calling ```owner.lookup(`service:${serviceName}`)```

- **`{{service serviceName methodName}}`** — Returns the method, bound to the instance.

### Properties

#### Getting Properties

Example using the built-in `{{get}}` helper and

[`ember-responsive`](https://github.com/freshbooks/ember-responsive). Note that

`{{get}}` returns a bound reference.

```hbs

{{#if (get (service "breakpoints") "isDesktop")}}

  Desktop breakpoint

{{else}}

  Mobile breakpoint

{{/if}}

```

#### Setting Properties

Example using [`ember-set-helper`](https://github.com/pzuraq/ember-set-helper).

```hbs

```

### Methods

Example using the

[`{{pick}}` helper from `ember-composable-helpers`](https://github.com/DockYard/ember-composable-helpers#pick)

to get the `event.target.checked` property.

```hbs

  Enable dark mode

  

```

```ts

export default class ThemeService extends Service {

  @tracked isDark = false;

  toggleDarkMode(newValue = !this.isDark) {

    // Even though this method isn't using `@action`, the `{{service}}` helper

    // binds it to the service instance.

    this.isDark = newValue;

  }

}

```

## Related

- [Pre-RFC 543: Ability to inject service into Template Only component](https://github.com/emberjs/rfcs/issues/543)