2017-03-22 6 views
1

ember serveを使用してemberアプリケーションに問題が発生していますが、すべてのコンポーネントがうまく動作しますが、Ubuntu 16.04でDigital Oceanドロップレットにデプロイすると、 。製造時にEmberコンポーネントがクラッシュする

ここでは、クラッシュしたコンポーネントのコード持っていた:{{countdown-timer}}{{radio-group}}

:その次のコンポーネントで

{{#if exam.show_progressbar}} 
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow={{progressValue}} aria-valuemin="0" aria-valuemax="100" style={{color}}> 
    <span>{{progressValue}}%</span> 
</div> 
{{/if}} 
{{#if exam.show_time}} 
    {{countdown-timer autoStart='false' startTime=exam.duration action='saveresponse'}} 
{{/if}} 
{{#each pagedContent as |result index|}} 
<div class="text-center"> 
    <p>{{result.questionID.description}}</p> 
    <br/><br/> 
</div> 
<form {{action 'saveresponse' on="submit"}}> 
    {{radio-group group=result.questionID.temp elements=result.questionID.rows action="updateValues" nombre=result.questionID.description}} 
    <br/> 
    <div class="row"> 
    <div class="column text-left"> 
     <button type="button" {{action 'showAlert'}} class="btn btn-primary"> 
     Cancelar 
     </button> 
    </div> 
    </div> 
    {{#if last}} 
    <div class="row"> 
    <div class="col-md-12 col-sm-12 col-xs-12 text-right"> 
     <div class="column text-right"> 
     <button type="submit" class="btn btn-primary"> 
      Guardar examen 
     </button> 
     </div> 
    </div> 
    </div> 
    {{/if}} 
</form> 
{{/each}} 
<div class="pager"> 
    {{page-numbers content=pagedContent currentPage=page action='checkLast'}} 
</div> 

エラー:私はこれを持っていた私の見解インサイド

import Ember from 'ember'; 
import pagedArray from 'ember-cli-pagination/computed/paged-array'; 

export default Ember.Component.extend({ 
    init(){ 
    this._super(...arguments); 
    this.send('fillQuestions'); 
    }, 
    didDestroyElement(){ 
    this.send('reset'); 
    }, 
    last: false, 
    toggleModal: false, 
    aciertos: 0, 
    errores: 0, 
    contenido: Ember.computed('questions', function() { 
    let i = 0, 
     content = [], 
     contenido = []; 
    for (i; i < this.get('questions.length'); i++) { 
     content.push(this.get('questions.' + i + '.id_question_group.questions')); 
    } 

    contenido = [].concat.apply([], content); 
    return contenido; 
    }), 
    count: 0, 
    page: 1, 
    perPage: 1, 
    pagedContent: pagedArray('contenido', { 
    pageBinding: "page", 
    perPageBinding: "perPage" 
    }), 
    totalPagesBinding: "pagedContent.totalPages", 
    progressValue: 0, 
    color: Ember.computed('count', function() { 
    return new Ember.String.htmlSafe("width: " + this.get('progressValue') + "%;"); 
    }), 
    actions: { 
    ...(all my actions) 
    } 
}); 

カウントダウンタイマーは、設定時間から0までカウントするember-cli-timerに基づくコンポーネントであり、ラジオグループコンポーネントにはラジオボタンヘルパーを横にします。

なぜ生産が機能していないのか、ローカルで動作しているのかについてのアイデアはありますか?

UPDATE 2017年3月23日

私はこのエラーを持っているChromeデベロッパーツールを使用して、多分これはもう少し私の問題を説明します。 this.set()その意思を持つ

actions: { 
    ... 
    fillQuestions(){ 
     let questions = this.get('contenido'); //Filled with exam questions 
     for(let i = 0; i < questions.length; i++){ 
      if(questions[i].questionID !== null && questions[i].questionID !== undefined){ 
       console.log(questions[i].questionID.description); //consoles the description of the question 
       this.set(questions[i].questionID.description, ''); //here it's the problem. 
      } 
     } 
    } 
    ... 
    } 

ライン:私はちょうどコンポーネントで正確なエラーを発見した2017年4月24日

Property set failed: You passed an empty path

UPDATEが、それは次の行動ですその問題は、questions[i].questionID.descriptionだから、それはempty pathなのですが、コンポーネントの新しいプロパティを同じアクションで作成する方法がありますか?

+0

あなたのカウントダウンタイマーに渡されると、あなたのexam.durationはセットされていますか?あなたは '{{log exam.duration}}'をチェックするために追加することができます。 – acorncom

+0

@acorncom '{{exam.duration}}'は空ではないことをログに示します。テンプレートかもしれません。 –

+0

あなたは疑わしいループをしているCPを持っています: 'contenido:Ember。計算された( 'contenido'' – locks

答えて

0

最後にエラーが見つかりました。コンポーネントが新しいプロパティを設定しようとしたときにエラーが表示されました。

本当の問題は: 質問のプロパティを保存しようとしたときにいくつか質問がありました。 Ember.computedはプロパティのためにそれらを使用することを許可していないと思われるので、私がthis.set('some.question.with.dots', '')を試したときにエラーが発生し、Property set failedを表示します。

解決方法は単純でしたが、文字列内のすべてのドットを置き換えるには、javascriptの.replace()関数を使用する必要がありました。

最終的なコードは次です:

actions: { 
    ... 
    fillQuestions(){ 
     let questions = this.get('contenido'); //Filled with exam questions 
     for(let i = 0; i < questions.length; i++){ 
      if(questions[i].questionID !== null && questions[i].questionID !== undefined){ 
       let desc = questions[i].questionID.description.replace(/\./g,''); 
       this.set(desc, ''); //the problem has gone 
      } 
     } 
    } 
    ... 
} 

は、彼らが視点で私をサポートして人々のすべてに感謝します。

関連する問題