1

リンクを介してアクセスされる投稿の表示ページを設定しようとしています:

<a class="post-link button" href="#">details</a>

投稿アイテムがレンダリングされると、次のような href が与えられます。

this.$('a').attr('href', this.postUrl());

...

postUrl: function() {
  return "#posts/" + this.model.get('id');
}

フィールドがレンダリングされると、リンクは次のように表示されます。

http://[path_to_app]/#posts/[whatever_id]

リンクをクリックすると、次のルーターにヒットするはずです。

routes: {
  ''          : 'index',
  'new'       : 'newPost',
  "posts/:id" : 'show'
}

しかし、私はこのエラーを受け取り、show 関数にはまったく入りません:

Uncaught Error: Syntax error, unrecognized expression: /1 jquery.js:4268
  Sizzle.errorjquery.js:4268
  Sizzle.filterjquery.js:4254
  Sizzlejquery.js:4044
  Sizzlejquery.js:5176
  jQuery.fn.extend.findjquery.js:5432
  jQuery.fn.jQuery.initjquery.js:188
  jQueryjquery.js:28
  hashchangetabs.js:9
  jQuery.event.dispatchjquery.js:3333
  jQuery.event.add.elemData.handle.eventHandle

リンクを「#post/」+ id に変更し、ルートを「post/:id」に変更すると、このエラーは発生しません。

私はバックボーンを学んでいる途中で、ここで実際に手を使うことができます. また、注意してください: 私のルートは posts#index アクションにルートします。

編集（より関連性の高いコード）：

# Model
[APP].Models.Post = Backbone.Model.extend({
  urlRoot: '/posts'
});

#Router
[APP].Routers.Posts = Support.SwappingRouter.extend({
  initialize: function(options) {
    this.el = $('#posts');
    this.collection = options.collection;
  },

  routes: {
    ''          : 'index',
    'new'       : 'newPost',
    "posts/:id" : 'show'
  },

  index: function() {
    var view = new [APP].Views.PostsIndex({ collection: this.collection });
    this.swap(view);
  },

  newPost: function() {
    var view = new [APP].Views.PostsNew({ collection: this.collection });
    this.swap(view);
  },

  show: function(postId) {
    var post = this.collection.get(postId);
    var postsRouter = this;
    post.fetch({
      success: function() {
        var view = new [APP].Views.PostShow({ model: post });
        postsRouter.swap(view);
      }
    });
  }
});

#Post Item View
[APP].Views.PostItem = Backbone.View.extend({
  tagName: 'tr',

  initialize: function() {
    _.bindAll(this, 'render');
  },

  render: function () {
    this.$el.attr('id', 'post_' + this.model.id);
    this.$el.html(JST['posts/item']({ post: this.model }));
    this.renderFormContents();
    return this;
  },

  renderFormContents: function() {
    ...
    this.$('a').attr('href', this.postUrl());
  },

  postUrl: function() {
    return "#posts/" + this.model.get('id');
  }
});
4

2 に答える 2

1

どこか、どういうわけか、この問題は、ファイルが特定の順序で読み込まれていないことが原因でした。もっと具体的に言えばいいのですが、backbone.min.js を適切な場所にロードしていませんでした。

ただし、カスタマイズしようとした古いバックボーンの部分ファイルが含まれていたため、壊れていて、削除されたと思われたため、いくつかの機能を使用することができました。

本当に、ちょっとの間、私が理解できなかった本当に愚かな間違い。ご協力いただきありがとうございます。

于 2012-07-19T19:47:53.550 に答える
0

バックボーンドキュメントのチェックアウトURLとurlRoot：おそらく標準のRESTfulリソースのURLを手動で設定する必要はありません：http：//documentcloud.github.com/backbone/#Model-url

于 2012-05-25T21:05:52.483 に答える