Відео

Hey, It's amazing content with animation and it's helping me quite a lot in building my angular app. I want to request youone thing that can you please create separate video on animating bootstrap modal dialog? Like how to animate modal dialog when it's opened and closed?

Do you still need renderer when using host binding?

thanks for the video, very informative and useful

As a newbie I've always asked myself wheter there is difference between @ViewChild and document.querySelector. Furthermore, what if I need to access some HTML element from parent in my child component?

i'm loving this tutorial series!! i have one request though, could you link to the non-animated templates you start with so it is easier to follow along? thanks!

Thank you Brian! Your videos have been of great help. Well done 💯

Thank you!

Great video! Thank you!

What a hidden gem! Amazing content man, keep pushing. Also, I have a question: when setting this whole animation, is the sidebar disappearing from the DOM when it is closed? Or does it just sit out of the user view? I am asking because idk if I should switch to the angular animations from using tailwind classes to achieve similar thing. What do you think?

Great content Brian 🚀😃, would be nice some new content about Angular Material and CDK modules, and someone about extending or applying custom styling to Angular Material components.

can we do scroll animation using angular-animations as using pure css isn't supported by all browsers

You have the best list of Cdk tutorials. Thanks for your work from Spain!

as a migrator from react to angualar I always found difficulty in animating comps in angular. now I'm super glad, that i found channel of yours, keep going brother !! 🔥🔥

good to see neat and cleaner code.

Thank you for this video. It is also possible to use @Component({host: {'[class.complete]': 'isComplete()'}})

what about attribute intellisense on such component? would be a very nice thing to have on most static components

It could also be an ordered list I guess? Nice to see efforts put on accessibility. Thanks for sharing!

You saved me. I struggled a lot with angular material mat-menu and matToolTip as they refused to display correctly next to the parent component. That import in the global styles file did the trick. Thank you!

Great video. Thank you for your time.

Hey there I am getting the following error "NG05105" please help

what are the advantages of using this instead of css classes to manage the animations?

how we can change the backdrop color

This content should get more views! This is exactly what I was looking for. It's really clearly explained. Thanks!

Your content is amazing! Hope more people discover your channel. Keep it going!

Explanatiin is so simple and great

Very good video!

Hello! What to do if my overlay is inside a scrollable dialog? So when the dialog gets scrolled the overlay doesnt stay relevant to the button that opened it, is it fixable?

Amazing. Thanks for sharing.

Hi Brian, like your Pluralsight courses. I think you definitely should create a course about Angular CDK as well as Animation make it available on Pluralsight . Great content thanks for sharing.

Damn! your video is such a high quality. You speak slowly and clearly, straight to the point. Everything is so bang on!

Thank you for the video , it is so helpful .I have an issue in my code , I can't seem to figure out the solution.And i will appreciate any help . When I put in my page another input field or an image (anything) the overplay doesn't appear on the top of them , but instead it gets detached from the origin input field and becomes under the bottom of whatever components in the page .I will appreciate any help on this matter . this is my code <div cdkOverlayOrigin #overlayPosition="cdkOverlayOrigin"> <mat-form-field> <input matInput #inputField (input)="filterOptions(inputField.value)" placeholder="Search..." (click)="detailsOpen=true"> </mat-form-field> </div> <ng-template cdkConnectedOverlay [cdkConnectedOverlayOrigin]="overlayPosition" [cdkConnectedOverlayOpen]="detailsOpen" (overlayOutsideClick)="detailsOpen=false" [cdkConnectedOverlayHasBackdrop]="true" [cdkConnectedOverlayPositions]="[ {originX: 'start', originY: 'center', overlayX: 'end', overlayY: 'center'}, {originX: 'start', originY: 'top', overlayX: 'end', overlayY: 'top'}, {originX: 'start', originY: 'bottom', overlayX: 'end', overlayY: 'bottom'} ]" style="position: absolute; top: calc(100% + 5px); width: 100%;"> <mat-list *ngIf="filteredOptions.length > 0"> <mat-list-item *ngFor="let option of filteredOptions" (click)="selectOption(option)"> {{ option }} </mat-list-item> </mat-list> </ng-template> </div> <div> <input type="text"> <img src="favicon.ico"> </div>

What is the advantage of moving the .focus() invocation from ngOnInit to constructor + effect?

Whats bennefits does cdk overlay have thay you dont have with a nativr <dialog>?

Thanks a lot, it was really useful!

Trying to implement this, but I feel that I am having issues with the binding. Is this a new addition to the animation package as I believe I am using an an older version? animations: [ trigger('slideInOut', [ transition('* <=> *', [ query(':enter', [ style({ transform: 'translateX(-100%)' }), animate('300ms ease-in', style({ transform: 'translateX(0%)' })) ]), query(':leave', [ animate('200ms ease-in', style({ transform: 'translateX(-100%)' })) ]) ]), ]) ] Could also be due to the fact I don't think I can do the for loop that you setup: <div [@slideInOut]="layerLinksInfo" [@.disabled]="maxNumberOfLayer <= 1"> <div *ngFor="let links of layerLinksInfo; let layerIndex=index"> <div *ngIf=......

Make sure to add video tags (pop up in top right) to your videos to help viewers quickly click onto content you reference, like at 0.55 when talking about your last video.

Very good video!

I'd like to watch you do a deep dive on how exactly signals can improve change detection/performance compared to getters or observables

Thank you my friend. Great video!

Very underrated channel ❤❤❤

Awesome! Keep up sir 🎉

Your explanation is so transparent. Thanks for your help!!

Sir please mak an video of cross component data sharing at different routes

So grateful for this series ❤I'm pondering though where you'd draw the decision line between employing Angular animations vs View Transitions API? (let's skip the browser support for now)

Clear!!!

Looking forward to the children query examples from you :)

When i try to import the output it gives @angular/core"' has no exported member named 'output'. Did you mean 'Output'?. i m using "@angular/core": "^17.1.0", i tried the with deleting node modules and re-install that's also not working. Any clue ?

Could you make a video talking about cdk portal???

Thanks for sharing, I'm seeing all your amazing content!!!

Excellent video!!!!