Архивы по месяцам: Февраль 2015

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

У меня есть пару 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

IE9 Действительно не нравится, когда вы берете ярлык с вашей <диапазон> Теги

Я упал в плохую привычку использовать Chrome все время.  Это «плохо», потому что вещи, которые я действительно должна выполняться на много других веб-браузеров, включая, к сожалению IE8.  Мой рабочий ноутбук имеет IE9 стандарт по любой причине) и я просто делаю быструю проверку, чтобы увидеть, какие вещи выглядели как и..., не было довольно.  Например:

image

Это * должен * чтобы выглядеть следующим образом:

image

 

Не только был выключен, но мои события click не стрельбы.  (Большинство из них, в любом случае).

Визуально, Он посмотрел, как вещи начали сходить с рельсов возле ссылки «Advanced Setup».  Я вырыл в этой части HTML и обнаружил, что у меня эта линия:

<Span класс = «glyphicon glyphicon новое окно» />

Это кажется как допустимый синтаксис («Версия chrome 40.02214.94 m» хорошо с ним). Я пошел и изменил его так или иначе, как показано:

<Span класс = «glyphicon glyphicon новое окно»></диапазон>

Что исправлено.

Такая крошечная вещица вызвало такой огромный беспорядок на экране.  Весело раз.

Это случилось быть быстро исправить, но это также та вещь, которая просто получает ваш позвоночник из выравнивания, когда вы его видите.  Есть более 500 строк HTML-кода в этой функции мало администратора и вы просто не хотят найти себе Копаем среди этих сорняков, когда-нибудь Улыбка.

</конец>

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

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