Backbone.js - 새 게시물을 만드는 코드는 어디에 있습니까?

포스트 모델, PostList 컬렉션 및 PostView + PostListView가있는 빠른 샘플 Backbone.js 앱을 만들려고합니다. 양식에 간단하게 게시 할 수 있고 게시물 목록에 게시물을 추가하는 간단한 방법입니다.Backbone.js - 새 게시물을 만드는 코드는 어디에 있습니까?

누군가가 게시 양식에서 제출을 클릭하면 PostList 수집을위한보기 인 "PostListView"에서 이벤트를 트리거합니다. 새 게시물 모델을 만들고 컬렉션에 추가하려면 어떻게해야합니까? View 자체에이 코드를 작성합니까? 또는 뷰가 이것을 수행하는 콜렉션 메소드를 호출합니까? 커스텀 콜렉션 메소드를 작성할 수 있습니까? 그렇다면 뷰에서 어떻게 호출 할 수 있습니까?

레일 배경에서 볼 때 뷰 (레일 컨트롤러)보다는 컬렉션/모델에 자연스럽게 코드를 삽입하지만 뷰에서 사용자 지정 컬렉션 이벤트를 호출하는 방법을 알 수 없습니다.

코드는 다음과 같습니다. 어떤 도움을 주셔서 감사합니다!

PostListView.coffee :

class forum.PostListView extends Backbone.View 
    tagName: 'section' 
    className: 'post-list' 

    events: 
     'click .post-form button': 'submit' 

    initialize: -> 
     #causes the view to render whenever the collection's data is loaded 
     @collection.bind 'reset', @render 
     @collection.bind 'add', @render 

    render: => 
     $(@el).html JST['postList']() 
     $postList = this.$('.post-list') 

     #iterates through posts, renders, appends to <ul> 
     @collection.each (post) => 
      view = new forum.PostView 
       model: post 
       collection: @collection 
      $postList.append view.render().el 

     return this 

    submit: -> 
     console.log "submitted!" 
     @collection.trigger 'newPost', this.$('.post-form textarea').val()

PostList.coffee : 당신은 컬렉션에 새로운 모델을 추가하려면 PostListView에서, PostList의 메소드를 호출

class forum.PostList extends Backbone.Collection 
    model: forum.Post 
    url: '/posts' 

    initialize: -> 
     this.bind 'newPost', newPost 

    newPost: (postText) -> 
     console.log "Collection method called!!" 
     # post = new forum.Post 
     # content: postText 

     # @add post

출처

2011-11-19 hurshagrawal

. 일반 js에서 이와 비슷한 것 :

this.collection.add(new forum.Post(this.$(".post-form textarea").val())); 당신이 그것을하는 방법을 추가 할 수 있습니다,

@collection.add new forum.Post 
      this.$(".post-form textarea").val()

는 새로운 PostPostList에 추가 더 복잡 경우 : 내가 커피 스크립트를하지 않는다

그래서 나는이 같은 것 위의 CS에 대한 구문을 추측 in PostList

this.collection.complexAdd(params...);

클래스를 만드는 위치에서 PostList에 사용자 지정 메서드를 추가하면 이미 newPost 메서드로 사용자 지정 메서드를 추가 한 것입니다.

보기가 마지막으로 초기화되므로보기 이벤트 수신 대기보다 훨씬 간단합니다.

편집 : 의견을 내릴 수도 있습니다. 어떤 사람들은 어떤 백본보기가 사용중인 모델/컬렉션을 선호하지만 한 모델에 대해 둘 이상의보기가있는 상황 (예 : TabContent 보기 및 단일 TabModel에 대한 TabSelector보기), 이는 물건을 더 복잡하게 만듭니다.

출처

2011-11-19 19:40:46 Esailija

다음 정보가 당신을 도울 수 ...

당신은 하나의 책임 새로운 포스트 양식을 관리하는 NewPost에 대한 별도의 뷰가있는 경우 그것은 것을 더 잘 분리 할 수 있습니다. PostListView는이를 생성하여 그 자체에 추가 할 수 있습니다.
일반적으로 새 모델을 저장 한 후에야 컬렉션에 추가하려고하지 않습니다. 그래서 당신이 할 수있는 일은 당신의 NewPostForm에 컬렉션에 대한 참조를 부여하고 그것이 저장되면 그것을 추가하게하는 것입니다.
또한 PostList가 덤프하고 NewPost보기를 다시 만든 다음 후속 게시물을 추가 할 준비가되도록 할 수 있습니다.

백본 "보기"는 때때로 레일스의 컨트롤러 동작과 비슷합니다. 따라서 모델을 만들고, 움직이며, 저장하는 등 뷰 코드에서 완벽하게 수행 할 수 있습니다.

출처

2011-11-19 22:18:24 maxl0rd

세 가지 도움말 모두에 감사드립니다. 굉장히 유용하다! 많이 정리 됐어. 서버에 레코드를 저장 한 후 트리거되는 이벤트가 있습니까? 컬렉션에 추가 할 코드를 연결할 수 있습니까? – hurshagrawal

기본적으로 그렇지 않습니다. 내 응용 프로그램에서, 나는 항상 이것을 추가합니다. 성공 콜백에서 add를 호출하거나 성공 콜백에서 추가 작업을 수행하는 이벤트를 트리거 할 수 있습니다. – maxl0rd

Backbone.js - 새 게시물을 만드는 코드는 어디에 있습니까?

답변

관련 문제