ember.js - 應用程序級處理

Question

我有一個 Ember.js 3.8 應用程序，我想在其中進行應用程序級錯誤處理。 我已經閱讀了文檔的相關部分，但它沒有按我的預期工作。

我有一個組件來測試它：

異常創建者.hbs

<div class="panel panel-info">
  <div class="panel-heading">Development Only - Exception Creator</div>
  <div class="panel-body">
    <p>Press the button below to create an exception</p>
    <button {{action 'throw' }}>Throw an Exception</button>
  </div>
</div>
{{yield}}

異常創建者.js

import Component from '@ember/component';

export default Component.extend({
  actions: {
    throw(){
      alert("About to throw an exception");
      throw new Error('Whoops!');
    }
  }
});

並且（根據我對 doco 的閱讀）我創建了一個路由application-error

應用程序-error.hbs

<h1>Error Handler</h1>
<p>This is the error handler</p>
{{outlet}}

應用程序-error.js

import Route from '@ember/routing/route';

export default Route.extend({
});

當按下按鈕時，我希望（在警報之后）被重新路由到application-error模板......但我不是。 確實發生的是調試控制台顯示“未捕獲的錯誤：哎呀。”。

有人能告訴我哪里出錯了嗎？

---

編輯

@stevenelberger 已經向我展示了正確的路徑，我現在有一個工作版本，我將把它放在這里，以便其他人將來可能會從中受益（不是說它有很多好處，但它可能會對某人有所幫助）。

我創建了一個新的路由exception-testing-route

異常測試-route.js

import Route from '@ember/routing/route';

export default Route.extend({
  model() {
    throw new Error('Whoops - something bad happened at exception-testing-route');
  },
   actions: {
    error(error, transition) {
      console.log("The action 'error' is firing in the route exception-testing-route.");
      console.log("About to return true to bubble the error.");
      return true;
      }
  },
});

異常測試-route.hbs

{{outlet}}

讓error操作返回 true 會導致錯誤冒泡，在這種情況下， application-error路由如下

應用程序-error.js

import Route from '@ember/routing/route';

export default Route.extend({

  setupController(controller, error) {
    console.log("application-error setupController firing");
    console.log(error.message);
    this._super(...arguments);
  }

});

應用程序-error.hbs

<h1>Error Handler</h1>
<p>This is the error handler</p>
{{outlet}}

調用 exception-testing-route 會導致以下處理序列。

Answer 1

我相信您可能錯過了文檔的這一部分：

與加載子狀態一樣，在拋出錯誤或從 [...] 路由的 model 掛鈎（或 beforeModel 或 afterModel）返回的被拒絕 promise 時， Ember 將查找錯誤模板或路由...

為澄清而添加了重點。 Your code is currently throwing an error from an action but Ember will only route to an error state if an error or rejected promise is thrown/returned from a route's model , beforeModel , or afterModel hooks (and potentially from a transition as well although the docs對此有點模棱兩可，我現在沒有時間測試）。

因此，要到達應用程序錯誤路線，您需要在某些路線的model 、 beforeModel或afterModel掛鈎中拋出錯誤或返回被拒絕的 promise 。