Видео

Thanks for the feedback. Anything good shines only after marketing. I'm working towards the marketing part. Hope I succeed.

Thanks for the high words. Glad to know it helped.

Glad to know it helped.

Glad to know it helped.

Thanks for the feedback. Glad to know it helped.

Thanks for the feedback. The list of the products in the cart must be implemented like this. Here 'products' is the property in the component class. <tr *ngFor="let product of products"> <td>{{product.name}}</td> <td>{{product.price}}</td> <td *ngIf="!product.available"> Not available </td> </tr>

@@simplacademy thank you for the reply, unfortunately it does not work. I will try to explain it again. So I have a list of products that are displayed in the home page cart with the buttons add to cart and View details. I want that when in the list of products, the item available is a boolean. So if the available product has a boolean of false, then the 2 buttons on the homepage of the product shoud not be shown, they should be replaced simply by a text 'Not available'. Will appreciate your help. Thanks.

This is how the 'Not Available' text, 'Add to Cart' and 'View details' button can be displayed. I have not included the products *ngFor loop, hope you understand that context. I have provided only the code on how the 'Not Available' text and buttons can be displayed. <span *ngIf="!product.available">Not Available</span> <button *ngIf="product.available">Add to Cart</button> <button>View details</button>

@@simplacademy wow! it works. Thanks a millionnnnnnnnn! Sorry for one last question. The cart now has all the descriptions and prices and qtty and availabilty. Is it possible to remove all those items in the carts that have the false and let them remain in the cart that says true? so just the photo of the product and the not avialable text should remain in the false .

Not sure if you are referring a product listing screen or cart screen. But everything falls to the inclusion of *ngIf directive in the right element, which you want to show or hide. Based on whatever you have completed, I hope you will be able to figure it out yourself.

github.com/simplacademy/reactive

Glad to know it helped.

Try pressing Ctrl+Space after typing the emmet abbreviation.

Thanks for the feedback. Glad to know it helped.

Thanks for the feedback.

Thanks for the feedback.

Glad to know it helped.

Maybe it should have been explained better. The 'Component for index.html' is applicable only for the root AppModule. The 'bootstrap' property in AppModule helps to convey that the component specified in this property (AppComponent) is what should be represented as component for <app-root> tag in index.html, hence the box 'Component for index.html' was included. It is mistake that it is included for each module, but it is applicable only for the root module which is the AppModule. Hope this clarifies. I will pin your question, so that others can get it clarified quickly.

Steps to find the issue: 1. Open the page in browser 2. Open Network tab in Developer Tools 3. Refresh the page 4. Hover over the image files listed and check the URL Check if the URL points to the right file location. If the URL is set with background-image property in a CSS file, then the image file reference should be defined relative to the path where the styles CSS file is present. For example, if the CSS file is present in 'styles' folder and the image file is present in the parent root folder, then the URL should be prefixed with double dot to represent the parent folder '../image-file-name'.

Thanks for the feedback. Glad to know it helped.

Hi @anuragranjan6739. Thanks for reaching out. It would be good, if we can discuss and understand our goals, which will help us to take the next steps. Initiate a private chat discussion in Linked In on my profile www.linkedin.com/in/chandrasekaran-janardhanan-2446068/. We will take it from there.

Thanks. Glad to know the short video format helps.

Glad to know it helped

Welcome

Check the chapter titled "Link form elements using formGroupName and formControl directives" starting at 14:48 and ending at 18:31. In this chapter, formGroupName directive is defined with index number value as 0, which represents the first item in the form array. If 2 is provided as formGroupName value, then it will display the third item in the array. Hope this explanation helps. If it is not clear, watch this video from the beginning and stop at 18:31. You implementation would end here just by changing the index value to 2 and there is no need to further watch and implement the rest of the details provided in this video. Hope this explanation helps. Do let know if there is any further clarification.

If we want to access a formarray element at a specific index number we use hobbies.controls[i].value that's ok but I want to access only option formcontrol value not correctanswer formcontrol value in formarray element at a specific index number

My requirement is I have a formarray with one formcontrol for checkbox and other is for a input field and I have let's say 10 this kind of elements in formarray and I want to show a input field if the checkbox of that checkbox formcontrol is checked for that specific checkbox only. Hope you got my requirement

@@baburaomcl574 Check this Stack Overflow post (stackoverflow.com/questions/61601533/access-value-of-formcontrol-from-formarray-in-reactive-form-in-html), there is an example on how to access the current row form control value. The input element can be included with *ngIf having a condition which checks if checkbox value is true, which will give you the expected result. Let me know if you need more clarification.

Thanks for the continued support and feedback.

Thanks again for the feedback.

Thanks for the feedback. Really helpful.

Thanks for the feedback. Glad to know it helped.

I have JavaScript course in Udemy. Check the about section of this channel to know how to get access to the course for free.

Ok Sir, thank you for your reply. You teach amazing@@simplacademy

Glad to know it helped.

Glad to know it helped

Glad to know it helped.

Thank you too

@rushikeshtokmurke5921, thanks for the feedback. Hope it lands safetly.

@srir78, thanks for the feedback. It is really motivating. I find it difficult to master ReactJS. It is quiet possible that I may not create a course on ReactJS.