ארכיון קטגוריה: זוויתי

עצה וגישה לפתרון בעיות עבור הוראות זוויתי (או, לומד לאהוב מקפים בכל מקום שוב)

יש לי כמה אפליקציות $http.get להפוך() קורא, ואני רוצה להיות מסוגל להציג הודעת שגיאה מעוצבת יפה עם פרטי שגיאה מכוער מוסתר, אבל נגיש.  בעיקרון, זה:

image

ולאחר מכן, אם המשתמש לוחץ על השגיאה, הם ראו מידע נוסף:

image

. דברים פשוטים  מאז אותה שגיאה פוטנציאלית המדויק יכולים להופיע המסך ניהולית, כמו גם את המסך משתמש הקצה, זה בבירור קרא הוראה זוויתי מותאם אישית.  אני  . מצאתי את זה הסדרה יוצאת מן הכלל מאמרים (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) מאת הגדול דן Wahlin.  בעקבות עצתו, יצרתי מהר מאוד <שלום-עולם> הוראת, עבר שלי מגב להציג שגיאה מורכבים יותר. נתקלתי קצת בצרות עם הוראה זו מורכבת יותר.  באושר, סוג של מקרה, אמרתי WebStorm (העורך שלהשתמש בימים אלה) כי קובץ JS קובץ זוויתי, זה עזר לי להבין את הנושא.  . זה הקוד עבור ההנחיה עצמה:

angular.module("CDLApp").הוראה("generalCdlErrorHandler", פונקציה() {

החזרה {
להגביל: "E",
החלף: נכון,

היקף: {
retrieveLastConfigurationError: "&"
},

תבנית:
'<div class = "התראה התראה-סכנה" תפקיד = "התראה" ng-init = "doShowExpandedErrorDetails = true" ng-שואו = "retrieveLastConfigurationError()">' +
"היה שם שגיאת קלט/פלט או בשגיאה אחרת. זה בדרך כלל קורה כי קובץ נתוני תצורה לא יכול להיות " +
"מצא או בתצורת הקובץ מכיל מידע לא מדויק (כגון הפנייה ספריית מסמכים ' +
' שאינו קיים).' +
' <br />' +
' <תוכנית-ng div = "doShowExpandedErrorDetails">' +
' <href = "#" ng-לחץ = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
'לחץ כאן כדי להסתיר פרטים'. +
' </של>: ' +
' <br />' +
' <טרום>{{retrieveLastConfigurationError() | json}}</טרום>' +
' <br />' +
' </div>' +
' <תוכנית-ng div = "!doShowExpandedErrorDetails">' +
' <href = "#" ng-לחץ = "doShowExpandedErrorDetails = ! doShowExpandedErrorDetails">' +
'לחץ כאן כדי להרחיב את פרטי שגיאה'. +
' </של>' +
' </div>' +
'</div>'
};
});

בעיקרון, . אני יוצר רכיב חדש שנקרא "generalCdlErrorHandler".  צריך גישה פונקציה שנקראת retrieveLastConfigurationError והוא זה מטופל של אובייקט היקף.  . אני בטח פשוט להשתמש ההיקף של ההורה, אבל זה מרגיש עצל.  אם מישהו חושב שאני צריך לעשות את זה, אשמח לשמוע הערות.

. זה היה בסדר, אבל לא קיבלתי כלום.  שגיאות צץ במסוף (לפחות פעם תיקנתי את כל השגיאות sx שיצרתי לאורך הדרך).  פשוט לא קיבלתי כל פלט של ההנחיה.  והלכתי הוסיף טקסט סטטי לפני ההנחיה ng-שואו ואני * כן * לענות. זה גרם לי לחשוב כי אולי ההנחיה לא הורשתה במרומז ליצירת vars חדשים כמו "doShowExpandedErrorDetails" או של "ng-init" יש שם. 

חזרתי לתוך ה-HTML כדי לראות שאם היה סוג והפעם WebStorm עזר לי.  היה לי כבר עובר בפונקציה retrieveLastConfigurationError ככה:

<כללי-cdl-שגיאה-המטפל retrieveLastConfigurationError="CDLController.retrieveLastConfigurationError()">
</כללי-cdl--מטפל בשגיאות>

אבל זה באמת היה צריך להיות כזה:

<כללי-cdl--מטפל בשגיאות אחזר-האחרונה--קיימת שגיאת תצורה = "CDLController.retrieveLastConfigurationError()">
</כללי-cdl--מטפל בשגיאות>

WebStorm היה חכם מספיק כדי לדעת שזה היה חייב להיות ממוקפות.  אם זה לא סיפק את הרמז הזה, אני כנראה להיות עדיין פתרון זה חיוך.  כיף פעמים!

הטריק הוא זה: לא רק שם הרכיב הוראת מיקוף, כך גם כל התכונות שתוסיף אליו.  פעם הוספתי את המקפים, כל עבד נהדר.  הדרכה של דן קרה כדי להשתמש בשמות אחת קצרה, אז עשיתי את החיבור.

מקווה שזה עוזר למישהו.

</קצה>

undefinedמנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

HTTP 406 שגיאה בעת שימוש $http.get זוויתי נגד נקודות הקצה של SharePoint מנוחה

עדכון: מארק AD ndersson הצביע נפלאה שכזו פרטי: http://blogs.office.com/2014/08/13/json-light-support-rest-sharepoint-api-released/. זה מסביר הרבה :).

אולי זו הכותרת הגרוע ביותר של הבלוג אי פעם! בכל אופו.

אני בדרך כלל עושה את כל שלי שטנץ נגד מופע O365. יש לי מופע אישי שלי כך לא צריך להיות מודאג להשפיע על מישהו אחר. במאמר מוסגר – זוכר מתי נתקשר נשאו סביב מכונות וירטואליות על המחשבים הניידים שלנו עם מוס – SQL Server, IIS, מחליטים vs Hyper-V. VMWare? בכל מקרה...

שפיתחתי אפליקציה באמצעות זוויתי בסביבה זו שעושה, בין היתר, זה:

$http.get(serverUrl)
.הצלחה(פונקציה(נתונים, מצב, כותרות, config) {

var getLinksResponse = נתונים;

getLinksResponse.value.forEach(פונקציה(תוצאה) {

// הלאה וקצף אז

זה היה עובד בסדר גמור בסביבות שני שונות SharePoint online. עם זאת, כאשר עמיתי מועבר זה מופע Cloudshare, הוא התחיל HTTP 406 שגיאה (מי היה הפעם הראשונה שקיבלתי אי פעם את זה, אז... איזה כיף, אני מניח). עשיתי קצת מחקר ואנו הכותרת "מקבל" היה את. SharePoint online היה מרוצה.:

קבל: יישום/json

אבל המופע cloudshare (מהי SP-פרם, מתארח בשרת וירטואלי) רציתי הקלאסי "odata = מילולי" הוסיף גם כן:

קבל: יישום/json;odata = מפורט

כדי לתקן את זה, הוספנו את הכותרת ככזה:

var config = {כותרות: {
'קבל': ' יישום/json;odata = מפורט '
}
};

$http.get(serverUrl,config)
.הצלחה(פונקציה(נתונים, מצב, כותרות, config) {

var getLinksResponse = נתונים;

getLinksResponse.value.forEach(פונקציה(תוצאה) {

// הלאה וקצף אז

כי יש להיפטר 406, אבל זה גם שינה את הפורמט של התגובה. זה היה יותר. מפורט. (haha!) עוד שינויים נדרשו והנה התוצאה הסופית:

var config = {כותרות: {
'קבל': ' יישום/json;odata = מפורט '
}
};

$http.get(serverUrl,config)
.הצלחה(פונקציה(נתונים, מצב, כותרות, config) {

var getLinksResponse = נתונים;

getLinksResponse.d.results.forEach(פונקציה(תוצאה) {

// הלאה וקצף אז

. זה רק הפך 30 דקה בעיה עבורנו, אז היה לנו מזל. אני מקווה שמישהו ימצא את זה שימושי.

</קצה>

כיצד לבצע: לאפשר מספר חלקים האינטרנט SharePoint זוויתי באותו עמוד

הבלוג הזה הודעות מתאר איך אתה יכול לקבל מספר Angular.js מבוסס web parts של SharePoint (הפניה באמצעות web part של עורך תוכן) באותו עמוד. . אני מתקשר web part של עורך תוכן (CEWP) שמפנה JavaScript נבנה באמצעות המסגרת Angular.js "זוויתי Web Part."

תהליך האתחול של זוויתי סופר קל והולך כל דוגמה שתמצא באינטרנט'ס משהו כזה:

<html ng-app = 'myApp'>

<בלה /><בלה /><בלה />

</html>

זה מתפרק, עם זאת, אם ברצונך לאפשר של CEWP מרובים המייצגים רכיבי web part זוויתי מרובים באותו עמוד. זוויתי רק באופן אוטומטי bootstrap נגד ההנחיה ng-app הראשון זה מוצא – לפחות גירסה זוויתי 1.3.6. הפתרון הוא פשוט למדי – באופן ידני bootstrap הקוד שלך במקום. האמור לעיל עכשיו משתנה למשהו כזה:

<הגוף>
<d
iv id =”bootstrapHere” ng-בקר =”myController כמו theController”>
<בלה /><בלה /><בלה />
</div>
</הגוף>

<סקריפט src =”//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js”></קובץ script>

<קובץ script>
angular.bootstrap(angular.element(document.getElementById(“bootstrapHere”)),['myApp']);
</קובץ script>

בעיקרון, במקום להשתמש ng-app ברכיב לעשות אתחול שלך, אתה סוטר מזהה על גבי ליסוד זה. לאחר מכן, להשתמש את "אוזן הנעל"() שיטה-זוויתי עצמו כדי לשלוט על אתחול לעבד בזמן ריצה. בדקתי את זה עם שלושה רכיבי web part זוויתי שונה באותו העמוד, וזה עובד קסם.

</קצה>

undefinedמנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin