Тёмный

Angular. Аттрибуты, классы и стили в шаблоне. NgStyle, NgClass, Attr. 

Максим Гром
Подписаться 8 тыс.
Просмотров 3,9 тыс.
50% 1

Опубликовано:

 

15 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 35   
@grommaks
@grommaks 2 года назад
Привет всем) Если я утомил своими 20 минутными лециями, то обратите внимание, что в конце каждого видео есть микро гайд В этом видео краткий материал начинается с 16:27 и длится всего 4 минуты. Приятного просмотра и рад что вы еще смотрите мои видео) С новым 2022 годом
@js2626
@js2626 2 года назад
можно ускорить видео)
@grommaks
@grommaks 2 года назад
@@js2626 я себя на 2х могу смотреть)
@js2626
@js2626 2 года назад
А вообще интересно объясняешь, очень интерестно смотреть, продолжай пожалуйста)
@leonidsimakov859
@leonidsimakov859 2 года назад
Спасибо, что продолжаете выпускать видео по Angular), контент становится полезнее и интереснее, ждем новых серий
@user-glory-of-ukraine
@user-glory-of-ukraine 2 года назад
дякую, супер контент!!!👍👍👍🧠
@njsaab9722
@njsaab9722 Год назад
Супер, спасибо большое)))
@bukanaka
@bukanaka 2 года назад
О, да, то, что мне, как раз, было нужно.
@EkaterinaKrol-k3q
@EkaterinaKrol-k3q Год назад
Спасибо за урок, все понятно, отлично структурировано! Хотелось добавить, что записи [style]="{'background-color': 'red'}" и [style]="{backgroundColor: 'red'}" аналогичны (по крайней мере в новых версиях ангуляра 13+). Будет работать в обоих случаях, применится css свойство элементу background-color: red;. Так что в случае со стилями, когда передаем объект, можно через камел кейс писать ключ и не оборачивать его в кавычки. Правда, в случае с классами так не сработает, придется писать в кавычках и через дефис, как у автора в примерах [class]="{'dark-blue'=true}"
@grommaks
@grommaks Год назад
Спасибо за дополнение)
@developerabdulaev4768
@developerabdulaev4768 2 года назад
Супер! Продолжай снимать видео 👍
@tox1cozZ
@tox1cozZ 2 года назад
Как всегда - супер! Лайк!
@antergonza6476
@antergonza6476 2 года назад
Like
@kkrasovski
@kkrasovski 2 года назад
Очередное полезное видео! Лайк конечно)
@MrVIPKent
@MrVIPKent 2 года назад
Чудовий контент та афігєнна подача, Макс продовжуй в тому ж дусі! Набагато доступніше ніж в Мініна!
@oleksandrvoron_ko580
@oleksandrvoron_ko580 Год назад
Тому що Макс через свої відео передає досвід та знання простими та зрозумілими фразами! А ще по ходу він колишній викладач, якщо я помиляюся автор поправить)
@js2626
@js2626 2 года назад
Супер, спасибо
@Fomenko1978
@Fomenko1978 2 года назад
Спасибо за видео, всегда смотрю вас с удовольствием и пользой. Вижу ситуацию следующим образом... ngClass и ngStyle - это директивы, [class] и [style] - привязка классов и стилей соответственно. По идее, директивы обеспечивают большую гибкость в сравнении с привязками классов и стилей + обеспечивают дополнительный уровень абстракции. Возможно свойства в привязках теперь умеют тоже, что и директивы. В теории должно быть так, что скажете?
@grommaks
@grommaks 2 года назад
Спасибо за отзыв) чуток разобрался, ngStyle и ngClass в старой версии ангулар был единственный способ байндить несколько стилей или классов, в то время как class.* это единственный способ лаконично сингл стили и классы задавать angular.io/guide/attribute-binding#binding-to-multiple-styles По стилям в оф доке написано что ngStyle будет удалено и стоит избегать, по ngClass ничего не сказано пока что, но думаю рекомендация также самая Сейчас директивой пользоваться не нужно, описанный в видео подход наиболее правильный) Все что вы описали было раньше актуально, но не смог найти с какой версии это стало так…у меня есть проекты и на 6 ангулар, хотелось бы знать когда как делать то нужно)
@RedkeiGost
@RedkeiGost 2 года назад
​@@grommaks Если мне память не изменяет, на метаните в пятом ангуларе было указано только про ngStyle. Если честно, только сейчас узнал, что можно по-другому.
@grommaks
@grommaks 2 года назад
@@RedkeiGost Да, недавно поддерживал старое приложение на 4ом ангуларе, там только ngStyle работает
@MrVIPKent
@MrVIPKent 2 года назад
@@grommaks в коментарях під відео наче ще одна гілка редіта, дуже корисно!
@diatm1506
@diatm1506 2 года назад
Джаваскриптизёры))) Каким образом можно следить что возвращается в методе TS иногда приходится писать any? Не всегда же с помощью interface - oв отслеживать? Как правильно использовать services и хорошо ли внутри сервиса обращаться к другому сервису? Как правильно их переиспользовать когда их становится много? В чем суть guard, interceptor, middleware?
@grommaks
@grommaks 2 года назад
Темы интересные но не все имеют простой ответ. Хорошо ли внутри сервиса обращаться к сервисам? - Да, для этого сервисы и придумали Как правильно переиспользовать их? - Изучить что такое SOLID принципы и следовать им, и будет счастье Guard - тема для плейлиста по routing, typeguard тема для плейлиста TS, interceprot - тема для плейлиста по сервисам, middleware это из мира bakend, тут уже nestjs вроде ближе..но очень похоже по логике на interceptor Что значит как следить что возвращается в методе? Вопрос не понятен Что такое interface of? такого я не знаю, на интерфесы проверять в TS нельзя, так как нет интерфейсов в JS файлах any нужно избегать по возможности всегда, если динамические параметры, то тут или дженерики foo(val: T): T{} либо типа unknown, который заставит получателя результата выполнить проверку типа или задать его явно...так сказать заставить клиентский код думать о типах Как правильно использовать сервисы? Так чтобы там небыло верстки и была работа с данными, так чтобы соответствовал SOLID принипам по возможности
@diatm1506
@diatm1506 2 года назад
@@grommaks спасибо огромное вам. Что значит как следить что возвращается в методе? Неправильно выразился указывать тип передаваемый в параметрах метода, .либо тип который возвращает метод. Проблема с типизацией я же был джаваскриптизёром пока не узнал TS) Дженерики моя больная тема(
@romanryaboshtan9270
@romanryaboshtan9270 2 года назад
Привет, можешь дать совет? Что ты делаешь, когда у тебя баг и ни в какую не можешь его исправить, а у тебя ещё другой функционал нужно реализовать и время поджимает. У меня как раз сейчас такая ситуация.?
@grommaks
@grommaks 2 года назад
Говорю менеджеру и техлиду статус по багу, и прошу ещё времени и они решают отложить баг или нет, а может передать другому разработчику
@romanryaboshtan9270
@romanryaboshtan9270 2 года назад
@@grommaks Спасибо большое, я этого не знал
@grommaks
@grommaks 2 года назад
@@romanryaboshtan9270 тут все просто, если работа требует больше времени чем было сказано вначале, то нужно сказать почему (если это баг, то тут сложно угадать, тут нужно перечислить все догадки и что было сделано за потраченное время), если этого «почему» хватит менеджеру, то он найдёт способ как получить больше часов от клиента, если это «почему» звучит не компетентно, мол ничего не знаю ничего не получилось, то тут уже разработчик не тянет, либо боится попросить помощи колег либо нет вообще интуиции разработчика, с таким пояснением не пойдёшь к клиенту А вот тут у меня видео на эту тему Как оценивать задачи в IT. Могут ли увольить джуна за перетрек? Оценка проекта (estimation) ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-_jA2lZ7EstI.html
@romanryaboshtan9270
@romanryaboshtan9270 2 года назад
@@grommaks да, спасибо, я этого не знал
@ВладиславХрамов
@ВладиславХрамов 2 года назад
Когда привязке [ngClass], [ngStyle] присваивается коллекция и каждый раз, когда любое из значений меняется (либо по идентификатору, либо при изменении их содержимого), значения будут применяться. [class] [style]- не выполняют глубокого наблюдения над предоставленными входными значениями.
@grommaks
@grommaks 2 года назад
ngStyle deprecated , согласно документации…а если не мутировать объект а копировать? Будет ли тогда style работать корректно?
@ВладиславХрамов
@ВладиславХрамов 2 года назад
@@grommaks Да, если копировать, то все будет норм
@zuev_roman
@zuev_roman 2 года назад
Напишите а комментариях - какие из них реально являются HTML атрибутами. Ты ж понимаешь, что говоришь это глядя на официальный тайпскрипт дефинишен DOM?
@grommaks
@grommaks 2 года назад
Действительно) хорошее замечание 👍👨‍🏫
Далее
Part 5. Roblox trend☠️
00:13
Просмотров 2,9 млн