Привет всем :) Если вы случайно попали на это видео, то можно начать проходить плейлист с начала Со знакомства с Angular ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-IrelRVjIttA.html Или с компонентов Angular ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-U5d_FtO_3NA.html А если не случайно, то приятного просмотра и спасибо за активность под этим и остальными видео у меня на канале
наконец пошли уже нормальные взрослые темы ) у мня идея для будущих видео, это по мимо обзора концепций, делать видосы по решению типовых повседненвных задач с использованием бэст-практик, что-то типа кук-бука для Ангуляра. например как сделать несколько асинхронных запросов, когда нужно дождатся выполнения каждого из них и полученные результаты используются в следующем и когда не нужно, механизмы обмена данными между родительским и дочерним компонентом, или когда эти компоненты вообще не связаны друг с другом и т.д. ну думаю ты лучше мня знаешь с чем кажды день сталкиватся Ангуляр-разработчик
Да, по мере роста базы, так и планировал разбавлять примерами которые будут собирать концепции нескольких уроков :) Это видео маленький пример того, что я хочу ^_^
По первому вопросу с "несколько асинхронных запросов" то тут ангуляр не при чем, это же rxjs, всякие zip, zipAll, там ничего военного. Обмен данными между компонентами тоже все просто, обычные сервисы с обсерваблами subject или behaviourSubject, в зависимости от задачи, нужно ли текущее значение, ну или ngrx, но там в доке и так все понятно. Вот и весь бестпрактис.
Долго ждал. Интересно конечно будет узнать приемущества кастомных деректив. Хочу узнать например в слайдере есть 2 кнопки next и prev в 1 дерективе есть возможность вешать по клику например 2 метода на prev и next handleNext, handlePrev или обработать сразу 2 события? Например клик и если курсор мыши не в поле зрения компонента если не ошибся mouseout то слидер будет листать слайды через 3 секи сам или взависимости от настроек в компаненте. Или нужно много деректив? Например audio player там столько событий... и там в какой-то книге шаблон применялся для плеера
Нужно делать так, чтобы пользоваться было легко клиентам такого кода, и чтобы когда нужно будет добавить новый функционал в ядро никому ничего не сломать Все остальное вкусовщина…и специфика конкретного решения
👍 классные видео! Вдарить еще по ранимой реактовской психике 😊 (не хейчу библиотеку если что) Resolve гвардами, Reuse stratage и сборкой апки для плеймаркета с деплоем, а то народ вроде знает, что угловатый это фреймворк, а вот в чем его фреймворкость и сила до конца не понимают
Со мной в фирме работают 600 человек на angular и из них деплоями и разбиением занимаются пару человек, я не в их числе))) я больше по ООП и модульной архитектуре…вот когда ковырну описанные практики, то обязательно запишу)
Очень круто, понятно как все связано, но не понятно почему оно так работает)) Может одна я такая зануда)) Спасибо за видео и объяснения! Максим, а есть ли у Вас видео как работать с запросами на backend и как о том, что может быть альтернативой redux в react? А то я пока не понимаю как работать со "стейтом", если его надо передать глубже, чем на одну вложенность, не передавать же дальше через Output - Input?
Максим, благодарю за конент. Совсем недавно делал меню и остановился на том, как клик снаружи отработать. Надо проверить, мне кажется что host-context(.hidden) тоже самое что :host { .hidden { ... }} По ссылке на гитхабе кода урока нет, там просто пустой ангуляр проект.
Крутой плей лист конечно, я уже 2 года работаю с Ангуляром, но мы никогда на работе не использовали ,и ну и по этой причине никогда не вставляли ничего в верстку между тегов компонента, а делали ее внутри html файла самого компонента, насколько это правильный подход и как делать лучше, какие плюсы и минусы?
Ваш подход для маленьких проектов самое оно Мой подход на больших Мой подход сложнее в реализации и понимании но позволяет сильно переиспользовать код, что удешевляет тестирование и поддержку Если цель сдать и забыть, то можно не тратить на это время и силы
@@grommaks Да вот именно что приложение просто огромное и включает в себя много маленьких приложений, в понедельник буду готовить 5-6 шаблонов экранов, пока сервисы пишутся. Попробую применить полученные знания на практике, главное что бы начальник не сильно ругался что я от концепции написания компонентов далеко ушел.
@@JlocbBTpaHcE сразу на проект тянуть новые знания это большой риск, лучше поковыряться в пет проекте вечерком, потом понять что подходит и взять в проект
Привет, Макс! Хорошее видео :) Спасибо, что быстро и понятно представляешь материалы! Мне вот интересный такой вопрос - какое преимущество того, чтобы использовать HostBinding для установки классов нашего хоста, перед самым обычным wrapper'ом/контейнером в темплейте, которому мы будем устанавливать данный класс? Ну, например, используя то же самый [ngClass] или [class] для div'а. Также интересно твое мнение о ситуации, когда у нас есть компоненты и часто приходиться добавлять какой-то div в качестве контейнера с какими-то стилями. И я вот видел, что этот контейнер убирают вообще с этими классами, и помещают эти классы в TS-файл, используя HostBinding. С одной стороны это идея, которая может существовать - у нас нету постоянных этих wrapper'ов в компонентах, придерживаясь данного стиля. Но как я думаю об этом - это лишнее. Зачем использовать мощь Ангуляра ради таких вещей (именно лишь для устранения контейнеров в верстке), превращать это в JS-код в bundle'ах, когда можно взять нативщину HTML + class атрибут :) Будет просто и понятно + не надо будет при просмотре темплейтов открывать каждый раз TS-файл, думая "а вдруг там что-то есть". Что скажешь об этом, стоит ли оно того?
Привет) спасибо за отзыв. В компонентах HostBinding используют редко, чаще обертки делают, тут все верно Но hostBinding это способ повлиять на общий между родителем контейнер, и как понимаешь что родитель уже не будет заморачиваться, а логика будет спрятана в ребёнке, не всегда UI либу делает тот же человек что и пользуется ею… Почему нужно бороться с лишними дивами? А не нужно, до тех пор пока это не интернет магазин или блог, где Гугл будет срезать поисковые баллы за грязную верстку…если сайт приватный, то тут и заморачиваться не нужно HostBinding часто используется в директивах, о чем мы будем говорить, и ещё часто используется в svg компонентах, когда мы не можем раскидываться лишним враппером… А так всегда нужно ходить в ts файл и смотреть какие инпуты туда передаются и на что можно подписаться )
@@grommaks , а, вот оно как) Я думал, что это какие-то лишние действия, а оказывается полезная штука в этой ситуации) Спасибо за ответ! Также есть ситуация, когда у нас есть враппер для какой-то директивы, например scrollToBottom, то здесь HostBinding не поможет, как я понял. Нужно тогда будет или её динамически сетить с ТС кода, ну или же просто на сам хост повесить в родительском компоненте.
Привет Максим, досмотрел ролик до момента с тем, где ты в :host положил класс (.menu) , судя по тому, что я нагуглил, вложенность это фишка SCSS , а я делал все на CSS, то есть дальше нет смысла продолжать, мне нужно пересоздать проект?
Привет, можно просто переименовать файл на Scss и должно работать без доп настроек Можно ещё самостоятельно прописывать css код, превращать мои записи в чистый css, я там только вложенностями пользуюсь, это не сложно переписать на обычный css
@@murakami374 желательно почитать что такое scss) Все вложенности через пробел пишутся, если есть символ & то без пробела (это склейка с прошлым селектором)
@@belerafon9288 материал использует angular/cdk, причём по исходникам я смотрел что материал добавляет очень мало в оригинальный cdk, считай ui составляющую. Как это сделать без cdk хочу понять, но уже после базовых плейлистов (когда будет понятно о директивах и сервисах) P.s. Посмотрел на entry components, они уже deprecated :(
@@grommaks у тинькова есть тайга, там изобрели свои порталы, поже смотрел но до конца понять их не могу, через сервисы они управляются это да, но как то сложно.
в нас на проекте HostBinding и HostListener с самого начала проекта нерекомендованы, насколько помню, так как давно уже о почти забыл об их существовани)) тимлид назвал их тяжелыми (в плане отработки) и устаревшими, если не ошибаюсь. То то скрытие, что в примере, делал бы через ngIf, наверное
ngIf убивает DOM елементы и убивает компонент...а при появлении будет все это снова создавать и создавать компонент. Это существенно нагружает чем HostBinding А как с директивами работаете тогда?
@@grommaks ну вместо ngIf можно и hidden. А вот по поводу HostBinding и HostListener, то нигде не нашел никаких подтверждений их проблемности(( и в группе по Ангуляру админ говорит, что такого не слышал. Возможно наш тимлид говорил только о HostBinding, а HostListener я уже сам приплел. Может ему просто статья какая-то на медиуме попалась субъективная... Не, на проекте то есть конечно единичные случаи использования. Например, директива для отлавливания кликов за пределами блока использует только HostListener и еще одна использует вижу HostBinding, хотя сама нигде не применяется) Ну в целом ото и все... А кейсы в видео понравились, то только через пол года от начала проекта задумался, действительно ли то плох HostBinding...
@@grommaks атрибут [hidden]="true" - это не свойство visibility: hiden. Запутали меня) специально ходил проверял. Этот атрибут добавляет display: none, что аналогично примеру в видео будет. и надо еще раз будет пересмотреть видео, но если там хостилистенеры в дочерных компонентах, то лучше ngIf применять, имхо.
Что-то запутался... Не правильнее ли там использовать :host(.hidden) вместо :host-context(:hidden). Клик же в примере вешает класс на хост, а не оборачивает его в этот селектор... host-context вроде же для второго предназначен... Как оно тогда отрабатывает... Ну это надо будет потестить...
Может я и напутал, хост работает только с хостом, хост контекст добавляет селектор спереди как глобальный, таким образом класс на боди будет влиять на стили
По существу в Ангуляр использовать display:none конечно можно, но все же.... Предпочтительнее думаю было бы *ngIf. Все же это ангуляр а не просто HTML & CSS в голом виде. Также, вот это слово "биндим" ... А русский и английский не ферштейн похоже. Сказать "привязываем" похоже автор не понимает. Все же, если видео заточено на обучение - то и должно нести языковую нагрузку и смыл передавать на том языке, на котором транслируется. По поводу "HostBinding" и "HostListener" в общем нормальное объяснение, за исключением вышеописанного.