Unbound Expression works as not expected in lightning

Question

Faced an issue where unbound expressions are not working as expected. Below is the scenario.

Parent component:

<aura:component implements="force:appHostable" controller="test1" >   
<aura:attribute name="campingItem" type="Camping_Item__c" default="{ 'sobjectType': 'Camping_Item__c'}" />    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>    <aura:attribute name="campingItemList" type="Camping_Item__c[]"/>


    <c:CampingItemList campingItems="{#v.campingItemList}" campingItem = "{#v.campingItem}"/>   

</aura:component>

Parent Controller:

({
    doInit : function(component, event, helper) {
        var action = component.get('c.getcampingItems');  

        // Configure response handler
        action.setCallback(this, function(response) {
            var state = response.getState();

            if(state === "SUCCESS") { 
                console.log('Working: ' + state); 
                component.set('v.campingItemList', response.getReturnValue()); 
                console.log('list: ' + component.get('v.campingItemList'));
            } else {
                console.log('Problem getting account, response state: ' + state);
            }
        }
        $A.enqueueAction(action);               

        component.set('v.campingItem.Name', 'check1'); 
    }
});

Child Component:

<aura:component implements="force:appHostable" controller="test1"> 
  <aura:attribute name="campingItems" type="Camping_Item__c[]"/>

<aura:attribute name="campingItem" type="Camping_Item__c" default="{ 'sobjectType': 'Camping_Item__c'}" />       

<ui:message aura:Id="msg" title="Error" class="slds-hide" severity="confirm" closable="true">        Successfully deleted ID    </ui:message>   

ABC = {!v.campingItem.Name} 

</aura:component>

Here, we are getting that value of the attribute campingItem in the child which we are setting it in the doInit of the parent i.e. check1 which is not supposed to be as per the developer guide as it is the unbound expression. But with list campingItemList its working as expected mean not getting the value.

Answer 1

Please check the below documentation link which very clearly says if you are going to use init events to load data for attributes which will get passed to other components then you have to use bound expressions. Unbound will not work for these cases

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/expr_data_binding.htm

Don’t use a component’s init event and client-side controller to initialize an attribute that is used in an unbound expression. The attribute will not be initialized. Use a bound expression instead. For more information on a component’s init event, see Invoking Actions on Component Initialization.

Alternatively, you can wrap the component in another component. When you instantiate the wrapped component in the wrapper component, initialize the attribute value instead of initializing the attribute in the wrapped component’s client-side controller.

Answer 2

When we use Unbound expression, it works as a one-way binding. So if we are passing any value as an attribute to child component, then both of the components have the same value(at initialization time), but then if we update the value in any of the components, it doesn't update to another one.