У меня есть пару apps что делать $http.get() звонки и я хотел иметь возможность показать красиво отформатированное сообщение об ошибке с описанием уродливые ошибки скрытые, но доступными. В основном, Это:
И то если пользователь нажимает на ошибки, они видят Подробнее:
Простые вещи. Поскольку точное же потенциальные ошибки могут появляться в административного экрана, а также экрана конечного пользователя, она четко призвала к пользовательской директивы угловой. Я нашел это Лучший сериал статей (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 был достаточно умен, чтобы знать, что он должен быть дефис. Если это не предусмотрено что намек, Я бы наверное по-прежнему устранение неполадок это . Весело раз!
Это трюк: не только имя элемента директивы дефис, так же любые атрибуты, вы добавить к нему. Как только я добавил дефисы, Все это работало большой. Учебник Дэна произошло использовать короткие имена одного, так что я не сделал соединение.
Понадейтесь что это помогает кто-то.
</конец>
Следуй за мной по щебетать на http://www.twitter.com/pagalvin