2013-07-05 4 views
0

내 앱을 사용하면 사용자가 문서를 관리 할 수 ​​있습니다. 하나를 만들 때 사용자는 수동으로 문서 내용을 입력하거나 컴퓨터에서 파일을 선택해야합니다 (사용자를 위해 많은 형식을 HTML로 변환 함).우려를 분리하는 적절한 방법은 무엇입니까?

현재, 나는 기본적으로 변화를 파일로 수신하고, { file: { type: SOME_TYPE' }, content: SOME_CONTENT } 같은 객체와 뷰의 value 속성을 업데이트하는 <input type="file">입니다 간단한 FileUploaderView 있습니다.

그런 다음 DocumentsNewController은 변경 내용을 수신하고 지원되는 파일을 HTML로 변환 한 후 그 결과를 문서 본문에 넣습니다.

그러나이 방법을 사용하는 것은 단순히 잘못된 것으로 느껴지며 간단한 재사용을 허용하지 않습니다.

App.DocumentsNewController = Ember.ObjectController.extend 
    # ... stuff ... 

    handleDocumentUpload: (-> 
    doc = @get 'documentUpload' 
    return unless doc 

    Ember.run => 
     @set 'uploadError', false 
     @set 'unsupportedFile', false 
     @set 'processingUpload', true 

    type = doc.file.type 
    text = '' 

    try 
     if type.match /^text\// 
     text = doc.content 
     # Convert new lines to br's and paragraphs 
     text = '<p>' + text.replace(/\n([ \t]*\n)+/g, '</p><p>').replace('\n', '<br />') + '</p>' 
     else if type == 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' 
     text = new DOCX2HTML(doc.content).convert() 
     else 
     @set 'unsupportedFile', true 
    catch error 
     @set 'uploadError', true 
    finally 
     @set 'text', text 
     Ember.run => @set 'processingUpload', false 
).observes 'documentUpload' 

그리고 템플릿이

... stuff ... 

{{view App.FileUploaderView valueBinding="documentUpload" accept="text/*"}} 

같은 어떤 컨트롤러에서 물건을 변환 파일을 리팩토링하는 적절한 방법이 될 것입니다? ,

{{documentHandler resultBinding="documentUpload"}} 

와 컨트롤러

내 첫번째 생각은, 입력 필드를 표시 스피너를 보여줄 것 DocumentHandlerView을 만드는 것이었다

App.DocumentsNewController = Ember.ObjectController.extend 
    # ... stuff ... 

    handleDocumentUpload: (-> 
    if doc = @get 'documentUpload' 
     @set 'text', doc 
).observes 'documentUpload' 
에서 :

내가 좋아하는 뭔가를 할 수 있도록하려면 오류를 표시하고, 문서를 구문 분석하고 결과를 result에 할당하십시오 (컨트롤러 템플릿에 resultBinding="documentUpload"이 있으므로 HTML은 컨트롤러의 관찰자를 트리거합니다).

보기를 사용하면 쉽게 재사용 할 수 있지만 여전히 문서를 구문 분석하는 것은보기 작업이 아니라고 느낍니다.

더 좋은 방법이 있습니까?

+0

귀하의 컨트롤러에 논리를 가지고 지금까지 정확한 위치를 솔기 – intuitivepixel

+0

하지만 다른 컨트롤러에서 다시 사용할 수 있기를 원합니다. 문서 처리를 할 필요가있는 모든 컨트롤러에서 그것을 복제하는 것은 너무 이상합니다. –

+0

컨트롤러 믹스를 작성한 다음 컨트롤러를 확장 할 수 있습니다. – intuitivepixel

답변

0

밀접하게 질문을 읽은 후에는 Ember.Mixin을 만든 다음 동일한 기능이 필요한 모든 컨트롤러에 사용하는 것이 가장 좋습니다. 타다 API docs에서 가져온

예 :

App.Editable = Ember.Mixin.create({ 
    edit: function() { 
    console.log('starting to edit'); 
    this.set('isEditing', true); 
    }, 
    isEditing: false 
}); 

// Mix mixins into classes by passing them as the first arguments to 
// .extend. 
App.CommentView = Ember.View.extend(App.Editable, { 
    template: Ember.Handlebars.compile('{{#if isEditing}}...{{else}}...{{/if}}') 
}); 

commentView = App.CommentView.create(); 
commentView.edit(); // outputs 'starting to edit' 

예는 개념 아니라, 그러나 mixin 직접 만들고 거기에 모든 일반적인 로직을 넣어 쉬운 것입니다.

희망이 있습니다.

+0

예, 생각했습니다. 컨트롤러간에 동작을 공유하는 좋은 방법입니다. 나는 문서 업로드를 처리하는 것이 처음에는이 컨트롤러의 일이라는 것을 완전히 확신하지는 못했다. 어쩌면 통제가 갈 수있는 방법일까요? –

관련 문제