Angular's New Output API: Emit notifications from your child components

Поділитися
Вставка
  • Опубліковано 20 січ 2025

КОМЕНТАРІ • 59

  • @anslara89
    @anslara89 День тому

    Spanish: Explicas muy bien, he empezado a reforzar mis conocimientos y el don de educar es único. Saludos desde Colombia (Neiva City).

  • @ronaldobicca7101
    @ronaldobicca7101 8 місяців тому +6

    Deborah, awesome video! Not a surprise. You are fantastic. Thank you so much.

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      That is so kind of you to say. 😊 Thank you!

  • @towercontrol4450
    @towercontrol4450 8 місяців тому +3

    By far the best angular tutorials I ever seen! Simple and easy!

  • @alexanderlemberger5412
    @alexanderlemberger5412 7 місяців тому +2

    Its the most intelligent and beautiful explanation on these new topics of signals. Thank you so much, you made my day :)))

    • @deborah_kurata
      @deborah_kurata  7 місяців тому

      That is kind of you so say. Thank you! 😊

  • @behzadkhosravanimajd
    @behzadkhosravanimajd 8 місяців тому +1

    Thank you, Master Deborah Kurata, for your generosity in sharing. God Bless.

  • @joebeurg
    @joebeurg 8 місяців тому +2

    Awesome explanation, let's see if the Angular team is thinking about HostListener and HostBinding decorators consistency as well.

  • @LarsRyeJeppesen
    @LarsRyeJeppesen 8 місяців тому

    We just went zoneless with our app - amazing!

  • @vijay_explorer
    @vijay_explorer 8 місяців тому +1

    Wow that's an awesome explanation, loved it!!

  • @austinZen8800
    @austinZen8800 6 місяців тому

    Thanks!

  • @cachabacha03ify
    @cachabacha03ify 8 місяців тому

    great video Deborah, thank youuuu

  • @message59
    @message59 8 місяців тому

    thank you so much for all your videos you have been a great help from the beginning ☺👌

  • @SachalChandio
    @SachalChandio 8 місяців тому

    you are doing awesome job at reviving this dead framework

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +1

      The reports of its death are greatly exaggerated! 😄

  • @igorr4682
    @igorr4682 8 місяців тому

    What about if you have more than one signal and want to use the effect function ? In react you can add dependency array that will tell what state this effect should react to

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      Yes, an effect can reference any number of signals and a change to any of them will trigger the effect.

  • @ANTONZUBAREV
    @ANTONZUBAREV 8 місяців тому

    thanks. And can you show us how to use debounce inside the effect method correctly?

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      I put together an example here: stackblitz.com/~/edit/outputfromobservable-deborahk
      I'll do a post about it soon.

  • @angelocolacicco997
    @angelocolacicco997 8 місяців тому

    so, what's the difference between signal output and signal model? they look the same

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +1

      Model inputs are a signal and allows for two way binding. The parent can pass a value to the child. If the child modifies the value, the changed value is passed back to the parent.
      CHILD: value = model(0);
      PARENT:
      The output API is NOT a signal, it's an event. It is a one-way notification from the child to the parent. It allows for event binding so the parent can react to that event.
      CHILD: onChange = output();
      PARENT:

  • @louisant1817
    @louisant1817 8 місяців тому

    Awesome content

  • @richarddefortune1329
    @richarddefortune1329 8 місяців тому

    My understanding is that effect() is still in experimental stage. Otherwise, I see myself reverting back to ngOnIni() or computed value just to process a side-effect.
    Thanks again for the video.

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      Yes, effect is still in developer preview: angular.io/api/core/effect

  • @SirWilliamWalker
    @SirWilliamWalker 8 місяців тому

    Great video!

  • @qwertymuzaffar
    @qwertymuzaffar 8 місяців тому

    What if we use computed signal instead of effect, Will this work ?

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      The purpose of the output API is to send events from the child component back to the parent component, providing notifications.
      If you need a value (or computed), you're better off using model inputs. Have you see that video? ua-cam.com/video/frXIBKqzTK0/v-deo.html

  • @salemhusseinidev
    @salemhusseinidev 8 місяців тому

    Heyya, awesome video as always. I’m wondering though, incase of needing to get the filtered list from an API, how would you go about denouncing it?

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +4

      Thank you!
      I assume you mean debouncing? There are outputToObservable() and outputFromObservable() functions. Those are great topics for another video!

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +1

      I put together an example here: stackblitz.com/~/edit/outputfromobservable-deborahk
      I'll do a post about it soon.

    • @salemhusseinidev
      @salemhusseinidev 8 місяців тому +1

      @@deborah_kurata Sorry for the typo :) and thank you very much for the quick reply, nice and clear.
      All the best :)

  • @chellaack1644
    @chellaack1644 8 місяців тому

    Mam your video is awesome and outstanding .no words to express my thanks.Mam can you please post a video in ngrx without lazy loading

    • @deborah_kurata
      @deborah_kurata  8 місяців тому

      Thank you for the kind words. I'll add "more NgRx" videos to my list of future topics. 😊

    • @chellaack1644
      @chellaack1644 8 місяців тому +1

      @@deborah_kurata Thank you so much Mam

  • @techwake360
    @techwake360 8 місяців тому

    that was awesome, Thanks

  • @Nabulio85
    @Nabulio85 8 місяців тому

    I love the way you explain things.
    Thx 🫶

  • @burak63783
    @burak63783 8 місяців тому

    Thanks for the video.
    Can u tell me why u create a filterEff variable instand use the effect inside the constructor? 8:44
    What are the benefits?

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +1

      Thank you for watching!
      Personally, I like to be declarative and declare effects as variables. It also allows you to built your own manual cleanup should you want to (using the variable). But primarily it is a personal style.

    • @burak63783
      @burak63783 8 місяців тому

      @@deborah_kurata I love this style. Never see it before. Do u have more styles for me 🤓

  • @sunil24sunil
    @sunil24sunil 7 місяців тому

    Your awesome keeping doing more stuff of all 🙏

  • @Saaad2
    @Saaad2 8 місяців тому +5

    Why you stopped creating Angular courses for PluralSight? Your Getting Started course was the best, haven't seen any such course anywhere and not only on React but I learnt other frameworks and libs too and no one is closer to your course. I just checked recently and your courses were marked as retired.

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +5

      Thank you for the kind words!
      It is definitely not by my choice.😥 Pluralsight will not allow me to update that course. They tell me that with the "Angular Fundamentals" course that my course was irrelevant.
      I *am* still doing courses for Pluralsight. I recently did this course: www.pluralsight.com/library/courses/rxjs-angular-signals-fundamentals

    • @Saaad2
      @Saaad2 8 місяців тому

      Thank you for responding me@@deborah_kurata The only reason I used and ever paid PluralSight was because of your Angular course.. your Getting Started course is such a comprehensive course which covered so much about Angular. Quick question: As Angular gets new version every 6 months and that course hasn't been updated recently, would you recommend anyone to take your Getting Started course even as it is marked as retired?

    • @deborah_kurata
      @deborah_kurata  8 місяців тому +3

      It depends.
      Often companies aren't on the most recent version of Angular, so depending on your project, learning Angular with v14 may be useful. It also does cover many of the basic concepts you'll need.
      The "coding along" is a bit more challenging because if you install the Angular CLI, you'll get Angular v17 and not everything in the course is compatible with v17. Sometimes, it's just little differences. (For example, the Angular team implemented a new code compiler, so you no longer need a '~' in your style file paths.) But these little things can cause new developers to stumble when "coding along".
      Just watching the course (not "coding along") does provide a good base set of knowledge for using Angular.

    • @Saaad2
      @Saaad2 8 місяців тому

      @@deborah_kurata Thank you so much for your time!

  • @mateuszkowalski4987
    @mateuszkowalski4987 7 місяців тому

    Great video!