video streaming with ember.js using video.js

I am trying to stream video using ember.js and video.js as a part of my practice projects

This is what I have done so far:

component/video.js:

import Ember from 'ember';
import videojs from 'videojs';

export default Ember.Component.extend({
  player: videojs('example-video'),

  x: this.get("player").ready(function() {
    this.get("player").src({
    src: 'http://ift.tt/1apVPR7',
    type: 'video/mp4'
    }).play();

  }),
});

template/component/video.hbs:

template/component/video-play.hbs

<h1>play video</h1>
  <p>
      
  </p>

route/video-play.js:

import Ember from 'ember';

export default Ember.Route.extend({

});

I am kind of new to ember and trying to keep the app simple. However, upon inspection I get this error:

The element or ID supplied is not valid. (videojs)

not quite sure what this error is and what causing this error

Any help would be greatly appreciated, Thanks