您好,登錄后才能下訂單哦!
這篇文章給大家介紹怎么在Angular中對(duì)未知異常錯(cuò)誤進(jìn)行處理,內(nèi)容非常詳細(xì),感興趣的小伙伴們可以參考借鑒,希望對(duì)大家能有所幫助。
core.js:5980 ERROR Error: [@ant-design/icons-angular]:the icon setting-o does not exist or is not registered. at IconNotFoundError (ant-design-icons-angular.js:94) at MapSubscriber.project (ant-design-icons-angular.js:222) at MapSubscriber._next (map.js:29) at MapSubscriber.next (Subscriber.js:49) at RefCountSubscriber._next (Subscriber.js:72) at RefCountSubscriber.next (Subscriber.js:49) at Subject.next (Subject.js:39) at ConnectableSubscriber._next (Subscriber.js:72) at ConnectableSubscriber.next (Subscriber.js:49) at CatchSubscriber.notifyNext (innerSubscribe.js:42)
而 Angular 是通過(guò) ErrorHandler 統(tǒng)一管理異常消息,而且只需要覆蓋其中的 handleError 方法并重新處理異常消息即可。
首先創(chuàng)建一個(gè) custom-error-handler.ts 文件:
import { ErrorHandler, Injectable } from '@angular/core'; @Injectable() export class CustomErrorHandler extends ErrorHandler { handleError(error: any): void { super.handleError(error); } }
CustomErrorHandler 可以完整的獲取當(dāng)前用戶數(shù)據(jù)、當(dāng)前異常消息對(duì)象等,并允許通過(guò) HttpClient 上報(bào)給后端。
以下是 NG-ALAIN 的文檔站,由于是使用 Google Analytics 來(lái)分析,只需要將異常消息轉(zhuǎn)給 onerror 即可:
import { DOCUMENT } from '@angular/common'; import { ErrorHandler, Inject, Injectable } from '@angular/core'; @Injectable() export class CustomErrorHandler extends ErrorHandler { constructor(@Inject(DOCUMENT) private doc: any) { super(); } handleError(error: any): void { try { super.handleError(error); } catch (e) { this.reportError(e); } this.reportError(error); } private reportError(error: string | Error): void { const win = this.doc.defaultView as any; if (win && win.onerror) { if (typeof error === 'string') { win.onerror(error); } else { win.onerror(error.message, undefined, undefined, undefined, error); } } } }
最后,在 AppModule 模塊內(nèi)注冊(cè) CustomErrorHandler :
@NgModule({ providers: [ { provide: ErrorHandler, useClass: CustomErrorHandler }, ] }) export class AppModule { }
事實(shí)上還有一項(xiàng)非常重要的工作,生產(chǎn)環(huán)境中都是打包壓縮過(guò)后的,換言之所產(chǎn)生的異常消息也是無(wú)法與實(shí)際代碼行數(shù)相同的數(shù)字,這就需要 SourceMap 的支持,當(dāng)然正常的生產(chǎn)環(huán)境是不會(huì)發(fā)布這份文件的,所以如果想要得到正確的行列數(shù),還是需要借助一層中間層,在后端利用 source-map 模塊來(lái)解析出真正的行列數(shù)值。
Angular 的依賴注入(DI)系統(tǒng)可以使我們快速替換一些 Angular 內(nèi)置模塊,從而實(shí)現(xiàn)在不修改業(yè)務(wù)層面時(shí)快速解決一些特殊需求。
關(guān)于怎么在Angular中對(duì)未知異常錯(cuò)誤進(jìn)行處理就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。