Emberjs outlet inside a bootstrap popover

I'm using bootstrap popover in my app and I need to render an outlet inside it.

I have this nested route :

this.resource('pages', function(){
    this.resource('page', { path: ':id' }, function(){
        this.resource('edit', function(){
            this.resource('images', function(){
                this.resource('image', { path: ':image_id'}, function(){
                    this.route('edit');
                })
            }); 
        }); 
    });
});

When the user is here => /pages/1/edit/ when he click on an image it route to /images but render the {{outlet}} inside the popover like this :

<div class="popover-content hide">
    {{outlet}}
</div>

This is my popover initialisation :

 $img.popover({
       html: true,
       content: function() { 
       return $('.popover-content').html(); //need to have the outlet here
       }
  }); 

So far, it render correctly my outlet, but inside the images template, I have some button that modify the DOM and it doesn't update the html. Unless if I close and open the popover again I can see the modification.

Is it possible to render the outlet directly inside the code ? or is it possible to have my popover being updated ?

Thanks for the help.