9

Backbone.js と jQuery モバイルの利点を組み合わせようとしています。私はモバイル デバイス用に開発しており、現在、デバッグ ログ メッセージ用の動的リストを開発しようとしています。コンソール ウィンドウがあり、その中にエントリを入れたいとします。問題は、 new を挿入した後<li>、リストを で更新する必要があること$('#myList').listview('refresh')です。これは私にはうまくいかず、次のエラーが発生します。

エラー: 初期化前にリストビューでメソッドを呼び出すことはできません。メソッド 'refresh' を呼び出そうとしました

tagName : 'ul',
id : 'console',
consoleTemplate : _.template($('#console-template').html()),
initialize : function() {
  console.log('ConsoleView:init');
  this.$el.attr('data-inset', 'true');
  this.$el.attr('data-role', 'listview');
  this.$el.css('width', '50%');
  this.$el.append(this.consoleTemplate());
  // für alle Funktionen die mit this arbeiten
  _.bindAll(this, 'render', 'addConsoleItem', 'appendConsoleItem');
  this.consoleItemCollection = new ConsoleItemCollection();
  this.consoleItemCollection.bind('add', this.appendConsoleItem);
  this.counter = 0;
  this.render();
},
render : function() {
  console.log('ConsoleView:render');
  var self = this;
  _(this.consoleItemCollection.models).each(function(item) {
    self.addConsoleItem(item);
  }, this);
  return this;
},

これは私のコンソール ビューの抜粋です。

var view = Backbone.View.extend({
  el : 'div',
  id : 'content',
  consoleView : null,
  initialize : function() {
    console.log('ApplicationView:init');
    _.bindAll(this, 'render');
    this.$el.attr('data-role', 'content');
    _.bindAll(this, 'render');
    this.consoleView = new ConsoleView();
    this.consoleView.addConsoleItem(new ConsoleItemModel());
  },
  render : function() {
    console.log('ApplicationView:render');
    this.$el.append(this.consoleView.render().el);
    return this;
  }
});

これは私のアプリケーション ビューです。

では、いつ更新メソッドを呼び出す必要があるのでしょうか?

ありがとうございました！

4

1 に答える 1

27

jQuery Mobile更新をトリガーする前に、listview を初期化する必要があります。

$('#myList').listview().listview('refresh');

これについて詳しく知りたい場合、および jQuery Mobile で動的に作成されたコンテンツを操作する際に注意することが重要である理由については、私のブログARTICLEをご覧ください。または、ここで見つけることができます。

于 2013-01-29T14:58:50.113 に答える