Error Ember.js "Unable to read property container 'undefined" when using Liquid Fire

I am starting to develop an interface and trying to use Ember.js for my project. I stumbled upon Edward Faulkner's great talk about Liquid Fire at EmberConf 2015. It looked incredibly easy to apply, and so I decided to try it.

My application uses Ember and Ember-Data Canary through ember-cli 0.2.0.

The structure of the application looks something like this:

application.hbs
  \users
     \user
        work.hbs
        profile.hbs
        ...
     user.hbs

And the part of the router.js file that is responsible for this:

this.resource('users', function (){
    this.resource('users.user', { path: '/:user_id' }, function () {
        this.route('work');
        this.route('profile');
        ...
    });
});

After I installed the addon with npm install --save-dev liquid-fire, I replaced the {{outlet}} in the user.hbs file with {{liquid-outlet}} and added the transitions.js file with some simple transition data:

export default function () {
  this.transition(
    this.toRoute('users.user'),
    this.use('fade')
  );
}

, javascript:

Uncaught TypeError: Cannot read property 'container' of undefined

liquid-outlet.js, 15:

var View = this.container.lookupFactory("view:liquid-outlet");

, . , - {{liquid-outlet}} - , , . , {{liquid-outlet}}, . .

,

+4
1

​​ -. , git

npm install ef4/liquid-fire --save-dev

, , .

github : https://github.com/ef4/liquid-fire/issues/190

+2

All Articles