2016-09-08 1 views
2

私は次のように動的コンポーネントを持っている:EmberテンプレートのHTMLBars例外から回復することはできますか?

{{component fooProperty owner=this}} 

fooPropertyはデータ駆動型で、時にはdev内、少なくとも今、間違って外れたが、私はそれが(原因アプリにすぎPRODに間違ってオフに来るかもしれない怖いですバージョン管理、永続ストレージなど)。基本的に、私はこれが常に正しいと信じていません(つまり、コンポーネントに解決可能)。値がオフの場合、全体のアプリはいえクラッシュ:

Uncaught Error: Assertion Failed: HTMLBars error: Could not find component named "some-inexisting-component" (no component or template with that name was found) 
EmberError @ ember.debug.js:19700 
assert @ ember.debug.js:6719 
assert @ ember.debug.js:19502 
componentHook @ ember.debug.js:10894 
render @ ember.debug.js:12782 
render @ ember.debug.js:12732 
handleKeyword @ ember.debug.js:46584 
keyword @ ember.debug.js:46709 
exports.default @ ember.debug.js:12483 
handleKeyword @ ember.debug.js:46545 
handleRedirect @ ember.debug.js:46531 
... 

私は、このような例外をキャッチし、クラッシュからアプリケーション全体を防ぐことを好むだろう。私は回避策を考えることができます。 fooPropertyを尋問してApp.__container__.lookupを返し、一般的な「不足」コンポーネントを返す。しかし、もし可能であれば、レンダリング中に発生した例外をキャプチャして処理する方法があるなら、私はまだ好むでしょう。

答えて

1

簡単な答えは「いいえ、でも自分で実装することができます」テンプレートエンジンは例外処理の役割を果たしていません。 Handlebars/HTMLbarsの場合だけでなく、JSX、Jinjaなどの他のテンプレートエンジンにも関係します。例外処理にはかなりのロジックが含まれているため、ユーザー側で指定する必要があり、プレゼンテーションの役割の範囲内にはないようです持ってる。その主な理由は、Ember Framework開発者が開発者がアプリケーション内にたくさんのスパゲッティコードを作成してしまうことを避け、コードの可読性と保守性を大幅に低下させる懸念があるからです。

あなたのケースのための可能な解決策:

component.js

import Component from 'ember-component'; 
import get from 'ember-metal/get'; 
import getOwner from 'ember-owner/get'; 
import { isEmpty } from 'ember-utils'; 
import computed from 'ember-computed'; 

export default Component.extend({ 
    wantToRenderComponentName: 'name-that-doesnt-exist', 
    wantToRenderComponentNameExist: computed('wantToRenderComponentName', { 
     get() { 
      const owner = getOwner(this); 
      return !isEmpty(owner.lookup(`component:${get(this, 'wantToRenderComponentName')}`)) 
     } 
    })  
}); 

template.hbs

{{#if wantToRenderComponentNameExist}} 
    {{component wantToRenderComponentName}} 
{{else}} 
    // handle your exception presentationally here 
{{/if}} 

owner.lookup('component:component-name')それはアプリ内で初期化されている場合、コンポーネントのインスタンスを返しますかundefinedではない場合。メモリを節約するためにいくつかの条件が満たされた場合、実行時にコンポーネントの一部を初期化して、アプリケーション内でコンポーネントが初期化され、テンプレートで使用できるかどうかをチェックする方法があると思います。このコードで例外が発生することはありませんが、動的コンポーネントの命名が使用されているため例外処理ではありません。そのため、コンポーネントの静的指定時にコンポーネントの存在に関する実際のチェックをコンパイル時と区別して実行時に移動できますレンダリングされるコンポーネントの名前。

0

本番環境では、アサーションエラーは発生しません。あなたのアプリはクラッシュしません。コンポーネントが存在する場合、それがレンダリングされます。

関連する問題