javascript - didInsertElement 事件在插入子元素之前触发

Question

使用colorselector插件，colorselector()函数应该在之后调用在浏览器中使用选项呈现选择。但是，使用 ember didInsertElement不起作用，因为在插入 <option> 之前触发了回调标签!

我试过这个:

App.ColorSelector = Ember.Select.extend({
  _initialize: function() {
    console.log(this.$().find('option').size()); // logs 0
    this.$().colorselector();
  }.on('didInsertElement');
});

App.ColorSelector = Ember.Select.extend({
  _initialize: function() {
    Ember.run.scheduleOnce('afterRender', this, function() {
      console.log(this.$().find('option').size()); // logs 0
      this.$().colorselector();
    });
  }.on('didInsertElement');
});

编辑:使用@SeanK 建议:

App.ColorSelector = Ember.Select.extend({
  didInsertElement: function() {
      console.log(this.$().find('option').size()); // logs 0
      this.$().colorselector();
  }
});

如何运行 colorselector() ember 插入 <select> 后的函数调用所有 <option>标签？

Answer 1

这对我来说在 Ember 1.7.0 上工作得很好

App = Em.Application.create();

App.ApplicationController = Ember.Controller.extend({
    colors: ['blue', 'green']
});

App.ColorSelector = Ember.Select.extend({
  didInsertElement: function() {
    console.log(this.$().find('option').size()); // logs 2
    //this.$().colorselector();
  }
});

Ember.Handlebars.helper('color-selector', App.ColorSelector);

模板:

<script type="text/x-handlebars">
    {{color-selector content=colors}}
</script>