I don't how I can express what I feel right now, you won't understand how much your video helped me after being stuck for more than 24 hours! thanks a lot!
@urtaav63917 күн бұрын
Como conecto esos componentes a un formulario reactivo ?
@Aliana960325 күн бұрын
This is an excellent way of explaining these concepts and their differences! Thank you for the efforts you have put in making this so clear to understand ❤
@rythmrana198728 күн бұрын
perfect
@rythmrana198728 күн бұрын
which version of angular is this
@CodeShotsWithProfanis28 күн бұрын
I am doing that with Angular 18 but it's also compatible with older versions.
@OlehBiblyiАй бұрын
Thank you, I didn't know about this
@GaryAnthonyScottonGplusАй бұрын
Great video as always, I have never used ngxs before only ngrx. 2 quick questions: In your experience what would make you choose one over the other? ngrx / ngxs What vs code plug-in shows the function parameters names, as I would find it very useful? I hope this makes sense😂 I.e createSelector(selectors: ..., projector: ...)...
@neduj37617 күн бұрын
Inline Parameters for VSCode
@rkrao8582Ай бұрын
This is great and I liked it. One question though! Is it okay to clutter the route file with logic? We also need to account for testing in that case I guess.
@CodeShotsWithProfanisАй бұрын
That's a good point! Like we do with resolvers and guards, I would also have that function in a separate file. Like you said, to unclutter the route file
@KartikKKaliaАй бұрын
My manager Manish Kumawat is your exact indian version. Super humble and knowledgeable.
@gayathrir1988Ай бұрын
useful
@akschauhan7601Ай бұрын
Nice
@ScubaShneveАй бұрын
I'm using standalone components and I'm getting this error, "NullInjectorError: NullInjectorError: No provider for _FormGroupDirective!".
@CodeShotsWithProfanisАй бұрын
I will have a look at this error and I'll publish video. Thanks!
@yusufkebbe29092 ай бұрын
Does this library works in React or Vue for example ? , becasue I'm working on web components, its little bit complicated, storybook stencil etc.
@CodeShotsWithProfanisАй бұрын
The components which are part of this library won't work in React or Vue. We would need to work with Web Components to have components working on any framework. We can convert an Angular component into a Web Component. For more read this angular.dev/guide/elements#using-custom-elements I had a bit of a hard time though making a custom element working in a React app. I am not sure if things have changed since I tried that (it was something like 1.5 years ago).
@yusufkebbe29092 ай бұрын
Amazing video you are angular hero
@zura86352 ай бұрын
Great Video! However I have a question... What do you think about sending /get-profile request to the API and storing user data using behaviour subject? Wouldn't that be as good?
@CodeShotsWithProfanisАй бұрын
Yes, that would work nicely as well. In fact, you can interact with a behaviourSubject (or a signal ;) ) and have this in sync with your storage (localStorage or sessionStorage)
@zura8635Ай бұрын
@@CodeShotsWithProfanis thanks for your feedback ❤️
@manthanmachhi81662 ай бұрын
Smooth one :) Liked it
@rkrao85822 ай бұрын
Hi Great video. So is it okay to send Signal as input to child component. Are there any gotchas to be keep in mind if I do so? For instance here in your example Say parent component has users as signal and sending down to input as signal?
@CodeShotsWithProfanisАй бұрын
In fact, we are sending the value of a signal to the child component.
@rkrao85822 ай бұрын
Great information. Do you have plans on adding write ups somewhere on Medium or some other blog?
@CodeShotsWithProfanis2 ай бұрын
Glad you liked it! I write my articles in Angular Love angular.love/en/author/fanis-prodromou. Hmm, perhaps I could write one for Signal Queries too 🤔
@CodeShotsWithProfanis2 ай бұрын
*Code Update* When I handled the UpdateComplete action at kzbin.info/www/bejne/d6uYk4GMZrunnsU I got fooled by Copilot and accepted the wrong code :( When we are dealing with the state, we should NOT mutate the state. We should produce a new state instead. This is the correct code const updatedTodoItems = state.todos.map((item) => { if (item.id === id) { return { ...item, completed: !item.completed, }; } return item; });
@zaferdemir46802 ай бұрын
I've always found state management complicated. I also know everyone hates it. NGXS does not appear to have eliminated this complexity.I prefer to use @ngrx/signals and I am very satisfied. Thank you for showing me that I was not wrong in my choice.
@sparksGTO2 ай бұрын
Amazing! Thank you very much!
@bantooshgaming90743 ай бұрын
Thankyou very much for the very informative video. This is what I have been looking for. But I have a question I have the same setup I am using the shared library in different workspaces. Locally everything works fine and I can see the shared library component in different workspaces but when deplying it "it doesnt work". It gives the error" NG0203: inject() must be called from an injection context such as a constructor," Could you please let me know if you have any soluition to this problem. I am using angular v18 using standalone components.
@Kestrel19713 ай бұрын
I'm new to Angular and I've been banging my head against the wall for about three days trying to figure this out; this made it crystal clear. Fantastic video. Thanks :)
@mohammeddarwish78583 ай бұрын
this is great, but how does this work when I'm reading from json file ? I mean how to save the component : () => ... and read it from json config file , if we save it json, when we return back the json then the import will be string !!! !!!
@CodeShotsWithProfanis3 ай бұрын
I am not sure which flow you are following to persist/get the JSON, but based on what you described, it seems to me that you might need to JSON.parse your JSON.
@Brendan2Alexander3 ай бұрын
Very helpful. Tho was just implementing ThrowError and it is now changed so it has to be like this: ThrowError(()=> err). But otherwise the same
@CodeShotsWithProfanis3 ай бұрын
Thanks for this. Indeed, the API changed
@camilojosepaterninapertuz11333 ай бұрын
What if i wanna markAsDiry each invalid inputs? How could i do this?
@eduardodavila52133 ай бұрын
Thank you for your content, straight to the point, just what I needed without wasting time, Liked! subscribed!
@CodeShotsWithProfanis3 ай бұрын
Glad you liked it! :)
@ellsonmendesYT3 ай бұрын
as always delivering great stuff, thanks for the effort and time taken to share with us!
@CodeShotsWithProfanis3 ай бұрын
Much appreciated!
@Hanumanthareddy973 ай бұрын
Thank you so much 🌈 exactly this is similar to my task
@CodeShotsWithProfanis4 ай бұрын
Angular Content Projection: Everything You Need to Know kzbin.info/www/bejne/mWrFaJ-Zn92IftE Angular ng-template: The Complete Guide to ng-template kzbin.info/www/bejne/m3SWhGyDq5Wti5o
@mikhailratner46494 ай бұрын
Interesting...I would never go to such lengths as you showed in the version prior to v18. I would just create a second Input and have an if else statement. However, the v18 version actually looks quite nice. If I understood corrctly, the actual content is by default linked to ng-content and Angular does the rest, which makes it much more concise. I wonder if there are better uses / examples which are more closely to real life. E.g. would it make sense to have some loading spinner as default content!?
@CodeShotsWithProfanis4 ай бұрын
> the actual content is by default linked to ng-content and Angular does the rest Yeah, that's correct. Some real-life scenarios could be: - You can have an image placeholder if content is missing - You can have some default buttons (call to actions) if content is missing
@madpwnz4 ай бұрын
Thanks for the video mate!
@ANJANALAKMAL4 ай бұрын
Great explanation. Thanks
@santiagobruno_t15814 ай бұрын
thanks!!!!
@invictuz48034 ай бұрын
It looks like formGroupName is an actual Angular directive now which automatically does what the ngOnInit is doing in this video, so you don't have to manually assign the child FormGroup instance. You do have to use ViewProvider in the child to provide ControlContainer to the view for the formGroupName directive to work within the child.
@podpison32684 ай бұрын
thanks
@dikendrasiwakotirowansiwak2244 ай бұрын
Why create different workspace if you can create multiple apps within projects directory in a single workspace ?
@CodeShotsWithProfanis4 ай бұрын
There are cases where companies decide not to have a mono-repo. A case of that is that they do not want to share with outsource companies their core business.
@alinisar25684 ай бұрын
hi, i have 1 question. how can i keep this api key secure. as application is deployed and its accessible to user.
@joaobentocandidobezerra64864 ай бұрын
The first one that gives an actual full view example on signals and http request. Was looking for something like this the whole day, thank you for that!🥰
@giorgoskontis71854 ай бұрын
Thank you mate!
@pedrofernandes20054 ай бұрын
outputFromObservable is really nice and useful!
@CodeShotsWithProfanis4 ай бұрын
Some corrections: In the parent component, we use the `viewchild` to query the child component. The child component might be undefined and that's why we use a condition. Since we know that the child component will be rendered, we can skip the if condition by simply marking the viewchild as required. The code will become: childComponentRef = viewChild. *required* (ChildComponent);
@HoNow2224 ай бұрын
just a question: there is any written documentation about this and the other new angular stuff?
@CodeShotsWithProfanis4 ай бұрын
You can find the docs here: angular.dev/guide/components/output-fn
@HoNow2224 ай бұрын
@@CodeShotsWithProfanis thanks
@HoNow2224 ай бұрын
this is becoming a little bit too complex
@CodeShotsWithProfanis4 ай бұрын
Are referring to the outputToObservable and outputFromObservable?
@HoNow2224 ай бұрын
@@CodeShotsWithProfanis both..
@CodeShotsWithProfanis4 ай бұрын
In most of the cases we would just have to use the output. In my opinion, the output API is simpler compared to the output decorator. And it's aligned with the signal inputs. The other two utility functions are great tools if we have such a need.
@HoNow2224 ай бұрын
@@CodeShotsWithProfanis thank you! just a question: there is any written documentation about this and the other new angular stuff?
@Niachan6664 ай бұрын
Good
@OlehBiblyi4 ай бұрын
Thanks for the explanation.
@matheusjordan60314 ай бұрын
very helpfull
@leiayuri4 ай бұрын
Hi, would you know if I have a component A which extends a directive B. And in comp. a I am in injecting a service A with inject and inside of the constructor I am also calling super and injecting the service A. The question is, am I creating 2 instances os service A? Thanks in advance.
@manmohanchauhanmusicbox4 ай бұрын
Nice explanation, Which plug-in you are using for Drawing over the VS code ?
@teolag5 ай бұрын
I agree with most others here. Fantastic presentation and a topic that is really difficult to find information about. Hope you will see this and have a good answer. The way you did with formGroupName works fine if the nested component is placed in the root of the form. But if we wrap the nested component in another element, like <div formGroupName='profile'><app-address formFieldName="address" /></div> the profile group will be ignored and the address form group won't be found. Do you know any solution to this issue?