エバーコンポーネントでのスローエラー

Question

コンポーネントからエラーをスローするための最良の方法は何ですか？次の例では、アクションが渡されているかどうかをチェックして、これをさらに実行しないようにエラーをスローしますが、エラールートは期待どおりにトリガーされません。

/** 
     * Save step and go to the next step. 
     */ 
     next() { 
      if (isEmpty(this.get('nextAction'))) { 
       throw new Error('The nextAction is undefined.'); 
      } 
      if (isEmpty(this.get('saveAction'))) { 
       throw new Error('The saveAction is undefined.'); 
      } 
      const insuranceApplication = this.get('model'); 
      if (this.isLastDependent(this.get('dependentIndex'), insuranceApplication.get('dependents.length'))) { 
       return this.get('nextAction')(); 
      } 
      return this.get('saveAction')().then(() => { 
       this.set('dependent', this.getNextDependent(insuranceApplication.get('dependents'))); 
      }); 
     } 

Answer 1

ルートテンプレートを使用してエラー状態を処理できます。 https://guides.emberjs.com/v2.14.0/routing/loading-and-error-substates/#toc_code-error-code-substates。

コンポーネントの場合は、エラーをキャッチしてコンポーネントのプロパティに割り当てる必要があります。

単純な例は、すでにあなたが持っているものに近いかもしれません。

// component.js 
if (isEmpty(this.get('nextAction'))) { 
    this.set('error', 'The nextAction is undefined.'); 
} 

// compontent.hbs 
{{#if error}} 
    Error: {{error}} 
{{/if}}