Hello, I'm new to Salesforce and I'm currently learning Aura Components Basics Module. I'm having problems with Input Data Using Forms unit at the moment.

The error says : "The campingList component isn't iterating the array of 'items' and creating 'campingListItem' components"

but it seems my program works fine, and I don't understand what exactly the error means?

Here's my code:

campingApp.app

<aura:application extends = "force:slds" >
    <c:campingHeader/>
    <c:campingList/>
</aura:application>

campingList.cmp

<aura:component >
    <aura:attribute name = "items" type = "Camping_Item__c[]"/>
    <aura:attribute name = "newItem" type = "Camping_Item__c"
                    default = "{ 'sobjectType': 'Camping_Item__c',
                                       'Quantity': 0,
                                       'Price': 0}"/>
    
    <!-- NEW CAMPING FORM STARTS HERE -->
    <form class="slds-form--stacked">          
        <lightning:input aura:id = "campingform" label = "Name" value = "{!v.newItem.Name__c}"/>
        <lightning:input aura:id = "campingform" type = "number" label = "Quantity" min = "1" value = "{!v.newItem.Quantity__c}"/>
        <lightning:input aura:id = "campingform" type = "number" label = "Price" formatter = "currency" value = "{!v.newItem.Price__c}"/>
        <br></br>
        <lightning:input aura:id = "campingform" type = "checkbox" label = "Packed?" value = "{!v.newItem.Packed__c}"/>
        <br></br>
        <lightning:button label = "Add an item" onclick = "{!c.clickCreateItem}"/>
    </form>
    <!-- CAMPING FORM ENDS HERE -->
    
    <!-- LIST OF CAMPING ITEMS STARTS HERE -->
    <aura:iteration items  = "{!v.items}" var = "item">        
        <c:campingListItem campingListItem = "{!item}"/>
    </aura:iteration>
    <!-- END OF CAMPING ITEMS -->
</aura:component>

campingListController.js

({
    clickCreateItem : function(component, event, helper) {
        var validItem = component.find('campingform').reduce(function(validSoFar, inputCmp){
            inputCmp.showHelpMessageIfInvalid();
            return validSoFar && inputCmp.get('v.validity').valid;
        }, true);
        if(validItem){
            var newItemList = component.get("v.items");
            var newItem = JSON.parse(JSON.stringify(component.get("v.newItem")));
            console.log("===== BEFORE =====");
            console.log(JSON.stringify(newItemList));
            newItemList.push(newItem);
            component.set("v.items", newItemList);
            console.log("===== AFTER =====");
            console.log(JSON.stringify(newItemList));
        }
    }  
})

campingListItem.cmp

<aura:component>
    <aura:attribute name="campingListItem" type="Camping_Item__c"/>
    <p>{!v.campingListItem.Name__c}</p>
    <p>{!v.campingListItem.Quantity__c}</p>
    <p>{!v.campingListItem.Price__c}</p>
    <p>{!v.campingListItem.Packed__c}</p>
</aura:component>

It would be great if someone explains why the error message says the campingListItem isn't created. Thanks!

Hello, I'm new to Lightning Components and I decided to create a calculator using Lightning Components.
Given two numbers, when I click "Add" the result should be displayed.

Here's the code:

calculator.cmp
<aura:component >
    <aura:attribute name = 'num1' type = 'Integer' default = '15'></aura:attribute>
    <aura:attribute name = 'num2' type = 'Integer' default = '20'></aura:attribute>
    <aura:attribute name = 'sum' type = 'Integer'></aura:attribute>
    <div>
        <p>Add</p><lightning:button label = 'Add' onClick = '{!c.add}'/>
        <p>{!v.num1} + {!v.num2} = {!v.sum}</p>
    </div>
</aura:component>

calculatorController.js
({
    add : function(component, event, helper) {     
        //Add numbers
        var num1 = component.get('v.num1');
        var num2 = component.get('v.num2');
        var sumResult = num1 + num2;
        component.set('v.sum', sumResult);
        
    }
})

The add result doesn't show up when I click the button. It'd be great if someone helps! Thanks!

Hello, I'm new to Lightning Components and I decided to create a calculator using Lightning Components.
Given two numbers, when I click "Add" the result should be displayed.

Here's the code:

calculator.cmp
<aura:component >
    <aura:attribute name = 'num1' type = 'Integer' default = '15'></aura:attribute>
    <aura:attribute name = 'num2' type = 'Integer' default = '20'></aura:attribute>
    <aura:attribute name = 'sum' type = 'Integer'></aura:attribute>
    <div>
        <p>Add</p><lightning:button label = 'Add' onClick = '{!c.add}'/>
        <p>{!v.num1} + {!v.num2} = {!v.sum}</p>
    </div>
</aura:component>

calculatorController.js
({
    add : function(component, event, helper) {     
        //Add numbers
        var num1 = component.get('v.num1');
        var num2 = component.get('v.num2');
        var sumResult = num1 + num2;
        component.set('v.sum', sumResult);
        
    }
})

The add result doesn't show up when I click the button. It'd be great if someone helps! Thanks!