initialize Bootstrap Material Design in Ember.js App

Question

I started learning Ember.js one week ago and I'm trying to integrate the Bootstrap Material Design in my app. I have read the documentation that says I need to call:

$.material.init()

I have tried to create a instance initializer and put this code in, but nothing happened.

Can anyone help me out to initialize the material effects in my Ember app?

Answer 1

I found the answer. According to the Ember Documentation, we can use an Application Instance Initializer which can run code when our App is loaded.

Application instance initializers are run as an application instance is loaded. They provide a way to configure the initial state of your application, as well as to set up dependency injections that are local to the application instance (e.g. A/B testing confurations).

So, I just generated a new instance initializer using ember-cli

ember generate instance-initializer bootstrap-material

And called the Bootstrap Material Design JS function:

// app/instance-initializers/bootstrap-material.js
import Ember from 'ember'

export function initialize(applicationInstance) {
    Ember.$.material.init();
};

export default {
    name: 'bootstrap-material',
    initialize: initialize
};

That is all I have done to get it working. Hope it helps.