Bojājumu Tip leņķa direktīvām (Vai, Mācīties mīlēt pārnesumzīmes pa visu vēlreiz)

Man ir pāris progr, kas padara $http.get() zvanus, un man vēlējās, lai varētu parādīt jauki formatēts kļūdas ziņojumu ar slēpto neglīts kļūdas detaļas, bet var piekļūt.  Būtībā, tas:

image

Un tad, ja lietotājs noklikšķina uz šo kļūdu, viņi redz vairāk info:

image

Vienkāršas lietas.  Kopš pašas iespējamās kļūdas var parādīties administratīvo ekrānu, kā arī gala lietotāja ekrāna, Tas skaidri aicināja pielāgotu leņķa direktīvu.  ES  uzskatīja, ka šis izcilu sērija raksti (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) ar lielo Dan Wahlin.  Pēc viņa padomu, Es ļoti ātri izveidot <Hello pasaule> direktīva un pārcēlās uz manu sarežģītāka kļūdu parādīšanas squeegee. Man uzbrauca mazliet problēmas sarežģītākas direktīvas.  Laimīgi, it_k ā nejauši, Bija teicis, WebStorm (Es izmantoju šajās dienās redaktors) ka JS fails ir leņķa failu un tas palīdzēja man saprast problēmu.  Šī ir pati direktīva kods:

Angular.Module("CDLApp").Direktīva("generalCdlErrorHandler", funkcija() {

atgriešanās {
ierobežotu: "E",
aizstāt: patiess,

darbības joma: {
retrieveLastConfigurationError: "&"
},

Veidne::
'<div class = "trauksmes signāls briesmu" loma = "brīdināt" ng-init = "doShowExpandedErrorDetails = true" ng šovs "retrieveLastConfigurationError =()">' +
"Radās ievadizvades kļūda vai citas kļūdas. Parasti tas notiek, jo konfigurācijas datu fails nevar tikt ' +
' atrast, vai_ar ī konfigurācijas fails satur nepatiesu informāciju (piemēram, apskatot dokumentu bibliotēkā " +
"kas nepastāv).' +
' <br />' +
' <div. ng-Parādīt = "doShowExpandedErrorDetails">' +
' <href = "#" ng klikšķi = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
"Noklikšķiniet šeit, lai paslēptu detaļas." +
' </a>: ' +
' <br />' +
' <Pre>{{retrieveLastConfigurationError() | JSON}}</Pre>' +
' <br />' +
' </DIV>' +
' <div. ng-Parādīt = "!doShowExpandedErrorDetails">' +
' <href = "#" ng klikšķi = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
"Noklikšķiniet šeit, lai paplašinātu kļūdas detaļas." +
' </a>' +
' </DIV>' +
'</DIV>'
};
});

Būtībā, Esmu izveidot jaunu elementu, sauc par "generalCdlErrorHandler".  Tai ir jāpiekļūst funkciju sauc retrieveLastConfigurationError un kas apstrādā objektu darbības jomu.  Es droši vien būtu varējis vienkārši izmantot pamata darbības joma, bet tā ir sajūta slinks.  Ja kāds domā, ka būtu jādara kas, Es labprāt vēlētos dzirdēt par to komentārus.

Tas bija viss kārtībā, bet es nesaņemu neko.  Bez kļūdām, kas popped konsole (vismaz vienu reizi es noteikti visas sx kļūdas es radīju gar ceļu).  Man vienkārši nebija saņemt jebkādu izvadi no direktīvas.  Es gāju un pievienot statisku tekstu pirms Direktīvas ng šovs, un es * darīja * dabūji. Tas lika man domāt, ka varbūt direktīva nebija atļauts netieši radīt jaunu vars, piemēram, "doShowExpandedErrorDetails" vai "ng-init" ir tur. 

Es devos atpakaļ uz HTML, lai redzētu, ja man bija tipa un šoreiz WebStorm palīdzēja man out.  Bija garām retrieveLastConfigurationError funkciju, kā tas:

<ģenerālis cdl-kļūda-apdarinātājs retrieveLastConfigurationError="CDLController.retrieveLastConfigurationError()">
</ģenerālis cdl-kļūda-apdarinātājs>

Bet tas tiešām vajadzēja šo:

<ģenerālis cdl-kļūda-apdarinātājs izgūt-pēdējo-konfigurācijas-kļūda = "CDLController.retrieveLastConfigurationError()">
</ģenerālis cdl-kļūda-apdarinātājs>

WebStorm bija pietiekami gudrs, lai zinu, ka to nācās veikt zilbjdali.  Ja tā nebija, ka mājiens, Es būtu droši vien būtu vēl traucējummeklēšana šī smaids.  Jautri reizes!

Tas ir triks: ne tikai Direktīvu elementa nosaukumu rakstāma, Tātad ir jebkādi atribūti, pievienojiet to.  Pēc tam, kad es pievienoja pārnesumzīmes, tas viss strādāja lieliski.  Dan apmācība notika ar vienu īsu nosaukumu lietošana, tāpēc es neizdarīja savienojums.

Ceru, ka tas palīdz kāds.

</beigās>

undefinedAbonēt manu blogu.

Sekot mani uz čivināt pie http://www.twitter.com/pagalvin

atstāt atbildi

Jūsu e-pasta adrese netiks publicēta. Obligātie lauki ir atzīmēti *