Добавление параметров пользовательского интерфейса JQuery в представления Ember

Предположим, я хотел бы изменить представление в образце Ember.js todo app быть изменяемого размера.

Код JQuery для этого будет:

$("#container").resizable()

где #container представляет собой div. Я не уверен, где в структуре приложения этот фрагмент будет принадлежать. Это идет внутри app.js? Содержание приведено ниже, и я не уверен, какой метод будет наиболее подходящим для добавления приведенного выше фрагмента.

Todos = Ember.Application.create();

Todos.Todo = Ember.Object.extend({
  title: null,
  isDone: false
});

Todos.todosController = Ember.ArrayController.create({
  content: [],

  createTodo: function(title) {
    var todo = Todos.Todo.create({ title: title });
    this.pushObject(todo);
  },

  clearCompletedTodos: function() {
    this.filterProperty('isDone', true).forEach(this.removeObject, this);
  },

  remaining: function() {
    return this.filterProperty('isDone', false).get('length');
  }.property('@each.isDone'),

  isEmpty: function() {
    return this.get('length') === 0;
  }.property('length'),

  allAreDone: function(key, value) {
    if (arguments.length === 2) {
      this.setEach('isDone', value);

      return value;
    } else {
      return !this.get('isEmpty') && this.everyProperty('isDone', true);
    }
  }.property('@each.isDone')
});

Todos.CreateTodoView = Ember.TextField.extend({
  insertNewline: function() {
    var value = this.get('value');

    if (value) {
      Todos.todosController.createTodo(value);
      this.set('value', '');
    }
  }
});

Todos.MainView = Ember.View.extend({
  templateName: 'main_view'
});

1 ответ

Обычно, когда вы имеете дело с плагинами манипулирования DOM, такими как этот, я хотел бы добавить его в представление didInsertElement метод, где this.$() является объектом jQuery, представляющим элемент представлений.

Todos.MainView = Ember.View.extend({
  templateName: 'main_view',
  didInsertElement: function(){
    this._super();
    this.$().resizable();
  }
});

Кстати, этот пример задач был заменен https://github.com/emberjs/examples/tree/master/todos, и даже это крайне устарело.

Другие вопросы по тегам