Структурные и атрибутные директивы. Новые @if @for Content Flow Angular 17 | Angular курс

[@МастерБицепс]

Попал на работу где Ангуляр , вот догоняю на ходу )) Спасибо за контент

[@dins-the-proger]

Супер, поздравляю) Удачи на работе

[@FrontendDeveloper-i1y]

Бро, не забрасывай этот курс. У тебя очень хорошо получается преподносить сложную информацию простыми словами. Жду новых видео!!! P.S. А будет ли какой-нибудь длинный видос в котором все эти знания закрепим на практике, каком-нибудь конкретном проекте, типа "блог на Angular 17" или "магазин на Angular 17"? Очень хотелось бы увидеть такое

[@VitalyVasilega]

В плейлисте есть ToDo angular. Но я пока не смотрел. Возможно там всё будет вместе

[@dins-the-proger]

@user-tn4nh5qd3p Спасибо большое. Забрасывать не буду, и да, буду стримить разработку более менее больших приложений, первый стрим уже был)

[@nouchance]

@@dins-the-proger i tebe toje bratan!

[@ЕвгенияОдесса-у8и]

Спасибо! да, интересна разница в работе ngFor / @for и т.п

[@kirillsankov4541]

Урок супер понятный получился! Спасибо за твою работу, скоро добъем 400 подписчиков) Буду олдом этого канала)

[@dins-the-proger]

Кайф, спасибо! Не привычно слышать от кого-тоьчто он будет олдом😂

[@amirichisomadinov]

Более года работаю с Angular. На дворе уже Конец Мая 2024 года.... И только что понял, в 5:50 минуте, чтооо я все это время использовал ngFor неправильно и даже не думал об этом(Я о том, что блок дива дублируется постоянно, это ж пипец просто.... ).... Пипец... Спасибо за это)) сердечко и лайк)

[@dins-the-proger]

Бывает) Спасибо за комментарий)

[@frontend_coder]

27:19 [ngSwitch]= "CurrentColor", это мы задаем переменную/значение, с которым мы будем работать, а *ngSwitchCase="'red'", это функция,которая уже что-то делает Знаю, что не очень понятно, но если поднапречь мозг, можно понять, что я написал

[@dins-the-proger]

Почти) ngSwitch - задает контект, а ngSwitchCase является уже непосредственно структурной директивой, так как изменяет структуру. А изменение происходит с помощью ng-template, от того и звездочка)

[@frontend_coder]

@@dins-the-proger Ааа, понял, спасибо за объяснение)

[@n_0ma_D]

Марафоню плейлист, это просто щикарно!

[@dins-the-proger]

Спасибо) Удачи с марафоном!

[@n_0ma_D]

@@dins-the-proger благодарю!

[@ФаяАхтямова]

Спасибо за такое крутое и простое объяснение!

[@dins-the-proger]

Пожалуйста)

[@dobrinyanicitich7514]

Классные уроки, спасибо!

[@dins-the-proger]

Спасибо за просмотр!

[@alexandraeisenzimmer9081]

А рaзве в 17 версии есть модули ?

[@dins-the-proger]

@@alexandraeisenzimmer9081 Конечно

[@dins-the-proger]

@@alexandraeisenzimmer9081 Они добавили новый вариант структуры со standalone, но модульное так же осталось

[@alexandraeisenzimmer9081]

@@dins-the-proger благодарю за ответ)

[@mestacey8120]

Автору огромный респект! Суперовский курс! Спасибо!

[@dins-the-proger]

Пожалуйста)

[@Николай-б7к]

Комент для продвижения. Спасибо тебе автор!

[@dins-the-proger]

Спасибо тебе комментатор)

[@НикитаВ-т5у]

все круто! спасибо за хорошую и простую подачу материала!

[@dins-the-proger]

Спасибо!

[@BillGadov]

Уроки хорошие Вот ))) Спасибо Вот )))

[@dins-the-proger]

Пожалуйста вот)

[@smersh-root]

По интерактиву с ngSwitch. Оставил процесс размышлений ниже, вдруг там есть зерно правды что отбросил, но итог думаю: ngSwith в таком виде пишется, потому что: не создает темплейт, а со свездочками - создают. И ngSwith - это "директива - набор/пакет директив". Варианта-предположения 3-и вышло: 1. Из-за биндинга (принимает значения из ts-файла). [ngSwith] ="атрибут". Вероятно натянуто, но что-то вроде того что тут чистое получение и присваивание значения атрибута, а в тех что с * - это не чистое принятие атрибута, например для if - это в итоге true\false, для for это элемент массива, для case -это возможное значение с которым надо сравнить. 2. * создает темплейт, [] нет. Отсюда еще вариант (2.1) вариант выходит, что ngSwith отличается по типу директивы от if\for\case. 2.1.(пока второй писал - придумал еще один) ngSwith - это директива - набор директив. Названия придумывают люди и решили назвать структурированный пакет директив - директивой :D Зато 3-ий уже кажется чересчур притянутым зауши и вообще развитием первого варианта - if\for\case - это директивы которые реально меняют что-то, а swith только принимает в себя значение и никак на него не влияя передает другим директивам под изменения. Т.е. swith просто приемник, а те что со * - что меняют структуру.

[@dins-the-proger]

Спасибо за комментарий Все немного проще. Switch - лишь оказывает область куда смотреть селекторам, а case как раз и выполняет логику скрытия/показа элемента, по этому он и со звездочкой, так как нужно обернуть ng-template

[@Ion_officcially]

продолжай, я одобряю

[@dins-the-proger]

Спасибо

[@IvanDev-b4t]

Я не могу понять почему так мало просмотров все доступно и интересно ! Я англ источники привык смотреть, но зачем если тут хороший курс базы.

[@dins-the-proger]

Спасибо большое! Ну не прям что бы мало, Angular не самый популярный фрейворк, а некоторые видосы уже почти 3к просмотров собрали) так что норм

[@IvanDev-b4t]

@@dins-the-proger Ты большой молодец и спасибо тебе за твое творчество, уверен что посмотрю весь курс.

[@javaDocent]

ngSwitch не стурктурная директива. Это своего рода контейнер или контекст, в котором будет применяться структурные директивы case. Т.е. директивы, которые могут изменять ДОМ

[@dins-the-proger]

Не согласен, ngSwitch структурная директива, просто где селектором выступает case

[@x1ag847]

Интерактивчик)) Думаю, что ngSwitch пишется в квадратных потому что нам не нужно ничего распоковывать и создавать ему ng-template. А вот с *ngIf это работает, потому что нам нужно раскрыть элемент и тд и тп. В свитче этого не требуется имхо

[@x1ag847]

грубо говоря ngSwitchCase изменяет и раскрывает элемент, а ngSwitch показывает какой элемент нужно раскрывать и изменять, но сам ничего не меняет и не раскрывает))

[@dins-the-proger]

Все так)

[@Ruby-fo6il]

Такой вопрос как я понял тут else if нету когда мы используем *ngIf, а может быть такое что создать свой кастомный директив где есть *else if по такому же принципу по которому работает ngSwitch? Я пока новичок в этом, если что простите за глупую мысль))

[@dins-the-proger]

Все правильно, else if нет, да и не должно быть наверное, просто сделай несколько ngIf, в чем проблема?) Если у тебя получиться сделать else if директиву очень круто, но вроде это не возможно

[@VitalyVasilega]

Спасибо за курс. Но хотел добавить. Не нужно постоянно писать public, в ts по умолчанию все методы и проперти открыты. А вот private нужно

[@dins-the-proger]

Это так, но лучше всегда явно указывать publiс, это улучшает читаемость кода

[@VitalyVasilega]

@@dins-the-proger возможно. Но у меня так настроен линтер, что он подсвечивает такие вещи, как ошибки.

[@dins-the-proger]

@@VitalyVasilega Линтер всегда можно перенастроить)

[@danilribka3411]

А если я буду писать директивы так @if,else,else if будет нормально?

[@dins-the-proger]

В документации подбронее описано как правильно использовать

[@danilribka3411]

А ты знаешь где найти качественную документацию кроме официального сайта?@@dins-the-proger

[@dins-the-proger]

Лучше официально доки ничего нет, на то она и официальная