Категория Архивы: Угловые

Неисправностей подсказка для угловых директив (Или, Научиться любить дефисы все снова)

У меня есть пару apps что делать $http.get() звонки и я хотел иметь возможность показать красиво отформатированное сообщение об ошибке с описанием уродливые ошибки скрытые, но доступными.  В основном, Это:

image

И то если пользователь нажимает на ошибки, они видят Подробнее:

image

Простые вещи.  Поскольку точное же потенциальные ошибки могут появляться в административного экрана, а также экрана конечного пользователя, она четко призвала к пользовательской директивы угловой.  Я  нашел это Лучший сериал статей (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) от Великого Дэн Уолину.  Следуя его советам, Я очень быстро создал <Привет, мир> Директива и переехал на мои более сложные ошибки отображения ракеля. Я побежал в немного проблемы с этой более сложной директивы.  К счастью, вроде случайно, Я сказал WebStorm (редактор, я использую эти дни) что файл JS файл угловой и он помог мне выяснить этот вопрос.  Это код для директивы, сам:

angular.Module(«CDLApp»).Директива(«generalCdlErrorHandler», функция() {

возвращение {
ограничить: «Е»,
заменить: Истина,

Сфера: {
retrieveLastConfigurationError: "&"
},

шаблон:
'<Div класс = "предупреждение предупреждение опасность" роль = «предупреждение" нг init = "doShowExpandedErrorDetails = true" нг шоу = «retrieveLastConfigurationError()">' +
«Там была ошибка ввода-вывода или другая ошибка. Обычно это происходит потому, что файл данных конфигурации не может быть ' +
' найдено или файл конфигурации содержит неточную информацию (Например, ссылки на библиотеки документов ' +
' что не существует).' +
' <br />' +
' <Div нг шоу = «doShowExpandedErrorDetails»>' +
' <a href = "#" нг клик = «doShowExpandedErrorDetails = ! doShowExpandedErrorDetails»>' +
«Нажмите здесь, чтобы скрыть подробности.» +
' </в>: ' +
' <br />' +
' <Pre>{{retrieveLastConfigurationError() | JSON}}</Pre>' +
' <br />' +
' </Div>' +
' <Div нг шоу =»!doShowExpandedErrorDetails»>' +
' <a href = "#" нг клик = «doShowExpandedErrorDetails = ! doShowExpandedErrorDetails»>' +
«Нажмите здесь, чтобы развернуть подробные сведения об ошибке.» +
' </в>' +
' </Div>' +
'</Div>'
};
});

В основном, Я создаю новый элемент под названием «generalCdlErrorHandler».  Доступ к функции с именем retrieveLastConfigurationError и что обрабатывается в объект области.  Я наверное мог бы просто использовать область родительского, но что чувствует ленивый.  Если кто-то думает, что я должен сделать, Хотел бы услышать об этом в комментариях.

Это было все хорошо, но я не получаю ничего.  Ошибки не выскочил в консоли (по крайней мере один раз я исправлены все ошибки sx, которую я создал по пути).  Я просто не получить какой-либо вывод из директивы.  Я пошел и добавил статический текст перед нг шоу директивы и я * ли * получить,. Это заставило меня думать, что возможно директива не разрешили создать новые переменные как «doShowExpandedErrorDetails» явно или неявно имеют «нг 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/. Это объясняет много :).

Это может быть когда-нибудь худшее название блога! Anyhoo.

Обычно я все мои прототипирования против экземпляра O365. У меня есть мой личный экземпляр, так что я не придется беспокоиться о затрагивающих никому. Как в сторону – Помните, когда мы называем осуществляется вокруг виртуальных машин на наших ноутбуков с Мосс – SQL Server, IIS, решение Hyper-V vs. VMWare? Anyhoo...

Я разработал приложение с помощью угловых в этой среде, что делает, среди прочего, Это:

$HTTP.Get(serverUrl)
.успех(функция(данные, статус, заголовки, config) {

var getLinksResponse = данные;

getLinksResponse.value.forEach(функция(theResult) {

// и так далее и так пены

Это отлично работает в двух различных средах SharePoint онлайн. Однако, Когда мой коллега перенес его в экземпляр Cloudshare, он становится HTTP 406 Ошибка (который был в первый раз, я когда-либо получил что один, так что... Ура, Наверное). Мы сделали несколько исследований и заметил, что заголовок «Принять» был выключен. SharePoint онлайн был совершенно счастлив с:

Примите: применение/json

Но cloudshare экземпляра (который является SP на Прем, виртуальный сервер) хотели классический «odata = verbose» также добавлен в:

Примите: применение/json;OData = подробный

Чтобы это исправить, Мы добавили заголовка как таковой:

var config = {заголовки: {
«Accept»: ' приложение/json;OData = verbose'
}
};

$HTTP.Get(serverUrl,config)
.успех(функция(данные, статус, заголовки, config) {

var getLinksResponse = данные;

getLinksResponse.value.forEach(функция(theResult) {

// и так далее и так пены

Что избавился от 406, но он также изменил формат ответа. Это было больше... подробный. (Ха-ха!) Необходимы дополнительные изменения и вот окончательный результат:

var config = {заголовки: {
«Accept»: ' приложение/json;OData = verbose'
}
};

$HTTP.Get(serverUrl,config)
.успех(функция(данные, статус, заголовки, config) {

var getLinksResponse = данные;

getLinksResponse.d.Results.forEach(функция(theResult) {

// и так далее и так пены

Это только превратился в 30 минуту проблема для нас, Поэтому мы повезло. Надеюсь кто-то считает это полезным.

</конец>

Инструкции: Включение нескольких угловых SharePoint веб-части на той же странице

Этот блог должности описывает, как вы можете иметь несколько Angular.js на основе веб-частей SharePoint (ссылка через веб-часть редактора содержимого) на той же странице. Я звоню веб-часть редактора содержимого (CEWP) что ссылки JavaScript, построен с помощью платформы Angular.js «Угловой веб-части.»

Процесс начальной загрузки угловой в супер легко и почти каждый пример, вы найдете в интернетах идет что-то вроде этого:

<HTML нг app = «myApp»>

<бла /><бла /><бла />

</HTML>

Это ломает, Однако, Если вы хотите включить несколько CEWP представляющие несколько угловых веб-части на той же странице. Угловая будет только автоматически загрузочный против первая директива нг app он находит – по крайней мере по состоянию на угловой версия 1.3.6. Решение довольно проста – вручную загрузочный код вместо. Выше теперь меняется на что-то вроде этого:

<тело>
<d
IV id =”bootstrapHere” нг контроллер =”myController как theController”>
<бла /><бла /><бла />
</Div>
</тело>

<сценарий src =”//AJAX.googleapis.com/Ajax/libs/angularjs/1.3.6/angular.js”></сценарий>

<сценарий>
angular.Bootstrap(angular.element(document.getElementById(“bootstrapHere”)),[«myApp»]);
</сценарий>

В основном, вместо нг app на элементе для сделать ваш начальная загрузка, Вы заляпать ID на этот элемент. Затем, Используйте загрузчик() метод угловых сам контролировать загрузку процесса во время выполнения. Я проверил это с трех различных угловых веб-частями на одной странице и он работает шарм.

</конец>

undefinedПодписаться на мой блог.

Следуй за мной по щебетать на http://www.twitter.com/pagalvin