Nekem van egy pár, apps, hogy hogy $http.get() hívások, és akartam, hogy képes megmutatni a szépen formázott hibaüzenet jelenik meg a csúnya hiba részleteit rejtett, de elérhető.  Alapvetően, Ez:

Majd ha a felhasználó rákattint a hiba, látják, további információ:

Egyszerű megtöm.  Mivel a pontos ugyanaz lehetséges hiba jelenhet meg a közigazgatási képernyő, valamint a végfelhasználó számára képernyőn, Ez egyértelműen nevű egyéni szögletes irányelve.  I  Ezt találtam kiváló sorozat cikkek (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) a nagy Dan Wahlin.  A tanácsát követve, Nagyon gyorsan készítettem egy <Helló, világ> irányelv és az összetettebb hiba bemutatás rakli esélytelennek. Én spárgagombolyog-ba egy kis baj, összetettebb irányelvről.  Boldogan, valami véletlen, Azt mondta WebStorm (a szerkesztő használom ezekben a napokban) hogy a JS reszelő volt egy szögletes fájlt, és ez segített nekem kitalálni, hogy a kérdés.  Ez a kód az maga az irányelv:

angular.Module("CDLApp").irányelv("generalCdlErrorHandler", függvény() {

    vissza {
        korlátozása: "E",
        csere: igaz,

        hatókör: {
            retrieveLastConfigurationError: "&"
        },

        sablon:
          '<div class = "figyelmeztető riasztás-veszély" szerep = "figyelmeztetés" ng-init = "doShowExpandedErrorDetails = true" ng-show = "retrieveLastConfigurationError()">' +
          "Volt egy I/O hiba vagy más hiba.  Ez általában azért történik, mert a konfigurációs adatok reszelő nem tudott lenni " +
          "található, vagy a konfigurációs fájl tartalmazza a pontatlan információk (mint viszonyítási dokumentumtárban " +
          "nem létezik).' +
          '  <br />' +
          '  <div ng-show = "doShowExpandedErrorDetails">' +
          '    <a href = "#" ng-kattintson = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
          "Kattintson ide, és elrejthetjük a részleteket." +
          '    </egy>: ' +
          '    <br />' +
          '    <előtti>{{retrieveLastConfigurationError() | JSON}}</előtti>' +
          '    <br />' +
          '  </Div>' +
          '  <div ng-show = "!doShowExpandedErrorDetails">' +
          '    <a href = "#" ng-kattintson = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
          "Kattintson ide a hiba részletek kibontása." +
          '    </egy>' +
          '  </Div>' +
          '</Div>'
    };
});

Alapvetően, Én létre egy új elemet úgynevezett "generalCdlErrorHandler".  Szüksége van egy funkció úgynevezett retrieveLastConfigurationError való hozzáférés, és hogy kezeli az alkalmazási objektum.  Talán tudtam volna csak használni a szülőtartomány, de úgy érzi, hogy lusta.  Ha valaki azt hiszi, hogy kellett volna, Szeretnék hallani róla a hozzászólások.

Ez volt minden finom, de én nem kapok semmit.  Nincs hiba bukkant fel a konzol (legalább egyszer én rögzített a sx hibák az út mentén létrehozott).  Egyszerűen nem kapok semmilyen kimenetet az irányelv.  Ment, és hozzáadott néhány statikus szöveget, mielőtt az ng-Térkép-irányelv, és * tett *, hogy. Ez jutott eszembe, hogy talán az irányelv nem engedték, hogy implicit módon hozhat létre új vars, mint a "doShowExpandedErrorDetails" vagy "ng-init" van, ott. 

Mentem vissza, hogy, ha én típus, és ez alkalommal WebStorm segített én ki a HTML-be.  Volt nem halad, mint ez a retrieveLastConfigurationError függvényben:

<általános-centrálzár-hiba-kezelő retrieveLastConfigurationError="CDLController.retrieveLastConfigurationError()">
</általános-centrálzár-hiba-kezelő>

De valóban szükség van, hogy ez a:

<általános-centrálzár-hibakezelő elhoz-utolsó-konfiguráció-hiba = "CDLController.retrieveLastConfigurationError()">
</általános-centrálzár-hiba-kezelő>

WebStorm volt elég okos, hogy tudja, hogy meg kellett Kötőjeles.  Ha ez nem biztosított, hogy tipp, Én lenne talán lehet még hibaelhárítás ez .  Fun-szer!

A trükk az ezt: nem csak az irányelv elemnév elválasztását, tehát van olyan attribútumokat ad hozzá.  Egyszer ki a kötőjeleket, minden munkás nagy.  Dan bemutató történt-hoz használ rövid nevek, így nem csinál a kapcsolatot.

Remél ez segít valaki.

</vége>

Subscribe to my blog.

Kövesse nekem Twitter http://www.twitter.com/pagalvin

Ez a blog hozzászólás ismerteti, hogyan lehet több Angular.js alapuló SharePoint-kijelzők (a Tartalomszerkesztő kijelző koordinátákkal) ugyanazon az oldalon. Hívom a Tartalomszerkesztő kijelző (CEWP) amely hivatkozik a JavaScript a Angular.js keretrendszer egy "szögletes kijelző."

Szög barátait betöltési folyamat szuper könnyű és csak arról szól minden példa megtalálja a internets megy valami ilyesmi:

<HTML ng-app = 'myApp'>

<bla /><bla /><bla />

</HTML>

Ez lebontja, azonban, Ha azt szeretné, ahhoz, hogy több CEWP képviselő több szögletes kijelzőt, ugyanazon az oldalon. Szög lesz csak automatikusan bootstrap ellen az első ng-app irányelv ez megtalál – legalább szögletes verziótól kezdve 1.3.6. A megoldás elég egyszerű – manuálisan bootstrap a kód helyett. A fenti most változik valami ilyesmi:

<szerv>
<dIV. id =”bootstrapHere” ng-controller =”myController, mint theController”>
<bla /><bla /><bla />
</Div>
</szerv>

<parancsfájl-src =”//Ajax.googleapis.com/Ajax/libs/angularjs/1.3.6/angular.js”></parancsfájl>

<parancsfájl>
angular.Bootstrap(angular.Element(document.getElementById(“bootstrapHere”)),['myApp']);
</parancsfájl>

Alapvetően, helyett használ ng-app-a elem-hoz csinál a bootstrapping, pofon rá az elem ID. Majd, a rendszer a rendszertöltőt használja() módszer, szögletes a maga, hogy ellenőrizzék a bootstrapping folyamat futási időben. Már tesztelték ezt a három különböző szögletes kijelzők ugyanazon az oldalon, és ez szerkezet egy igézet.

</vége>

Subscribe to my blog.

Kövesse nekem Twitter http://www.twitter.com/pagalvin