Měsíční archivy: Únor 2015

Trouble-shooting Tip pro úhlové směrnic (Nebo, Naučit se znovu milovat spojovníky)

Mám několik aplikací, které se $http.get() volání a chtěl jsem být schopen Ukázat pěkně formátované chybové zprávy s podrobnostmi k ošklivé chybě skryté, ale přístupný.  V podstatě, to:

image

A pak pokud uživatel klepne na chybu, Zobrazit více informací:

image

Jednoduché věci.  Vzhledem k tomu, že přesně stejný potenciální chyba se může objevit v administrativní obrazovku, stejně jako obrazovka koncového uživatele, jasně vyzval k vlastní úhlové směrnice.  JÁ  našel to vynikající seriál článků (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) velký Dan Wahlin.  Po jeho radu, Vytvořil jsem velmi rychle <Hello svět> směrnice a přesunul se k mé složitější Chyba zobrazení stěrka. Narazil jsem na problémy s touto složitější směrnicí.  Šťastně, jaksi náhodou, Řekl jsem měl WebStorm (editor, který používám v těchto dnech) že byl soubor JS soubor úhlové a to mi pomohlo vyřešit problém.  To je kód pro samotné směrnice:

angular.Module("CDLApp").směrnice("generalCdlErrorHandler", funkce() {

návrat {
omezit: "E",
nahradit: pravda,

rozsah: {
retrieveLastConfigurationError: "&"
},

Šablona:
'<div třída = "upozornit upozornění nebezpečí" role = "upozornění" NG-init = "doShowExpandedErrorDetails = true" NG-show = "retrieveLastConfigurationError()">' +
"Tam byl chyby nebo jiné chybě. To se obvykle stává, protože konfigurace datového souboru nelze ' +
' nalezeno nebo konfigurační soubor obsahuje nesprávné informace (například odkazující na knihovnu dokumentů ' +
' neexistuje).' +
' <BR />' +
' <div ng-show = "doShowExpandedErrorDetails">' +
' <href = "#" NG klikněte = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
"Klepnutím sem skryjete detaily." +
' </a>: ' +
' <BR />' +
' <pre>{{retrieveLastConfigurationError() | JSON}}</pre>' +
' <BR />' +
' </div>' +
' <div ng-show = "!doShowExpandedErrorDetails">' +
' <href = "#" NG klikněte = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
"Klepnutím sem rozbalíte podrobnosti o chybě." +
' </a>' +
' </div>' +
'</div>'
};
});

V podstatě, Já jsem vytvořit nový prvek s názvem "generalCdlErrorHandler".  Potřebuje přístup k funkci nazvanou retrieveLastConfigurationError a která je zpracována v rozsahu objektu.  Pravděpodobně by mohla jen použil jsem nadřazené obor, ale to je líný.  Pokud si někdo myslí, že jsem měl udělat, Rád bych slyšet o tom v komentářích.

To bylo vše v pořádku, ale jsem nic nedělal.  Žádné chyby vyskočila v konzole (alespoň jednou jsem opravil všechny chyby sx, vytvořené po cestě).  Prostě nedostal jsem žádný výstup z působnosti této směrnice.  Šel jsem a přidal nějaký statický text před ng výstava směrnice a * to * že. To se mi myslím, že možná směrnice nebylo dovoleno implicitně vytvořit nové vars jako "doShowExpandedErrorDetails", nebo mají "ng-init" tam. 

Vrátil jsem se do HTML zjistit, že jestli jsem měl typ a tentokrát WebStorm mi pomohl.  Jsem měl kolem ve funkci retrieveLastConfigurationError jako je tento:

<Generál cdl popisovač chyb retrieveLastConfigurationError="CDLController.retrieveLastConfigurationError()">
</Generál cdl popisovač chyb>

Ale to opravdu potřeba se tento:

<Generál cdl popisovač chyb načíst poslední konfigurace chyba = "CDLController.retrieveLastConfigurationError()">
</Generál cdl popisovač chyb>

WebStorm byl dost chytrý na to, vědět, že to muselo být rozdělován.  Pokud to nebyl ten náznak, Já bych asi být stále řešení problémů to Usměj se.  Zábavné krát!

Trik je v tom to: Nejenže je název směrnice prvku dělení, tak jsou všechny atributy, které přidáte k němu.  Jakmile jsem přidal spojovníky, Všechno to fungovalo skvěle.  Dan kurz se stalo používat krátká jména jednoho, tak jsem neudělal spojení.

Doufám, že to pomůže někdo.

</Konec>

undefinedPřihlásit se na mém blogu.

Za mnou na Twitter na http://www.twitter.com/pagalvin

IE9 Opravdu nemá ráda, když budete mít zástupce s vaší <rozpětí> Značky

Dostal jsem se do zlozvyk používat Chrome celou dobu.  Je to "špatné", protože to, co jsem rozvíjet skutečně potřebuje, aby běžet na spoustu jiných webových prohlížečů, včetně, Bohužel IE8.  Moje pracovní notebook má IE9 standard z nějakého důvodu) a dělal jsem jen rychle zkontrolovat, co vypadal jako a... to nebylo pěkné.  Například:

image

Má * předpokládá * vypadat takto:

image

 

Nejenže to bylo pryč, ale moje click události nebyly palbu.  (Většina z nich, Každopádně).

Vizuálně, Vypadalo to, že všechno začalo jít z kolejí nedaleko odkaz "Pokročilé nastavení".  Do té části HTML a zjistil jsem, že tento řádek:

<rozpětí třídy = "glyphicon glyphicon nové okno" />

To se jeví jako přípustné syntaxe ("Chrome verze 40.02214.94 m"je v pořádku s ním). Šel jsem a změnil jej stejně, Jak je uvedeno:

<rozpětí třídy = "glyphicon glyphicon nové okno"></rozpětí>

To to.

Taková malá maličkost způsobila obrovský nepořádek obrazovky.  Zábavné krát.

To stalo se narychlo, ale to je také druh věcí, které prostě dostane vaše páteř sklopené, když ji.  Existuje více než 500 řádky HTML v této malé admin funkce a vy jen nechcete najít sami kopat mezi tyto plevele, někdy Usměj se.

</Konec>

undefinedPřihlásit se na mém blogu.

Za mnou na Twitter na http://www.twitter.com/pagalvin