ember.js - tutorial - emberjs api docs

Uncaught: no se puede llamar a rerender en una vista que se destruye

Question

Cuando navego por mi aplicación, a menudo obtengo este error que destruye aún más toda la navegación en mi aplicación, y tengo que volver a cargar toda la página:

Uncaught You can''t call rerender on a view being destroyed

Yo, y un par de chicos en el canal IRC de Ember descubrieron cuál es la causa del problema.

Es el asistente de grupo de https://github.com/emberjs/group-helper que uso. Toda la aplicación está configurada para usar eso, y muchas cosas se rompen si la elimino porque entonces muchas etiquetas metamorph comienzan a crearse nuevamente.

¿Alguna idea de cómo modificar el helper para que desaparezca el error?

var get = Ember.get, set = Ember.set, EmberHandlebars = Ember.Handlebars;
EmberHandlebars.registerHelper(''group'', function(options) {
var data = options.data,
fn = options.fn,
view = data.view,
childView;
childView = view.createChildView(Ember._MetamorphView, {
context: get(view, ''context''),
template: function(context, options) {
options.data.insideGroup = true;
return fn(context, options);
}
});
view.appendChild(childView);
});

Actualizado: las cosas a continuación están desactualizadas y solo están allí porque estaban en la publicación original

En mi aplicación, tengo estas tres subclases, en las cuales baso todas mis vistas, controladores de array y rutas.

Ver:

PageView = Ember.View.extend({
title: '''',
identifier: '''',
classNames: [''page''],
willDestroyElement: function () {
var elm_classes = this.$().attr(''class'') + '' out'',
elm_height = this.$().height(),
temporary_container = $(''<div class="''+elm_classes+''">'');
this.$().children().appendTo(temporary_container);
temporary_container.insertAfter(this.$());
window.setTimeout(function() {
temporary_container.remove();
}, animationKillDuration);
},
didInsertElement: function() {
$(document).trigger(''royalbeer-page-rendered'');
}
});

Controlador de matriz

RoyalArrayController = Ember.ArrayController.extend({
goto: function(route, slug) {
if (!slug)
this.transitionToRoute(route);
else
this.transitionToRoute(route, slug);
}
});

Ruta:

RoyalRoute = Ember.Route.extend({
setupController: function(controller, model) {
var modelName = this.routeName.substr(0, 1).toUpperCase() + this.routeName.substr(1),
slug = model;
if (model.hasOwnProperty(''slug''))
slug = model.slug;
controller.set(''model'', App[modelName].find({''slug'': slug}));
},
serialize: function(slug, params) {
var name, object;
object = {};
name = params[0];
object[name] = slug;
return object;
}
});

Utilizo la función goto en el controlador de array para vincular elementos en mi aplicación para la navegación con {{action goto ''routename'' slug}} , y mi serializador y setupController en mi ruta están configurados para poder manejar eso, lo cual funciona perfectamente hasta que ocurra el error.

Y solo puedo adivinar que es por eso que la cosa se rompe.

¿Alguna idea sobre qué está pasando y cómo solucionarlo?

Answer 1

Lo he resuelto ahora quitando el helper del grupo y reescribí todo mi CSS de usar: first-child /: last-child to: first-of-type /: last-of-type. Incluyendo Twitter Bootstrap. Funciona. Pero realmente me gustaría una manera de hacer que Ember no hinche mi DOM con etiquetas de metamorfosis en general.