Hello, I have two components ie. when I click on TileSample.cmp it opens up with the details page of SegmentDetail.cmp. I am facing an isue when for example when I click on a 1st recond in the tile sample it is loading the details, then when I immediately go back click on the second tile record it is only desplaying the old values and only upon the second click it is loading the actual values. Can someone help me here?

I.e. WHen I click the 1st record int he tileSample.cmp it is loading the deatils and when I go back and click on the 2nd Tile record it is showing up the old records value(1st record in the TileSample.cmp). Then when I go back again and click the 2nd record on the TileSample.cmp page then only it is showing the correct values.

tileSample.cmp
<aura:iteration items="{!v.Segments}" var="seg" indexVar="i">
                <lightning:layoutItem size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default" >
                    
                    <ul class="slds-has-dividers_around-space">
                        <li class="slds-item">
                            <lightning:tile class="slds-tile_board">
                                <h4 class="slds-tile__title slds-truncate" title="{!seg.segmentNumber}" onclick="{!c.openSegmentDetail}" id="{!i}"><a href="javascript:void(0);">{!seg.segmentNumber}</a></h4>
                                <b>Customer Name:</b>    <p class="slds-text-heading_medium">{!seg.customerName}</p>
                                <!--     <b>tourId :</b>         <p class="slds-text-heading_medium">{!seg.customerName}</p> -->
                                <b>Customer Rate:</b>    <p class="slds-truncate"><a href="#">{!seg.customerRate}</a></p>
                                <div class="slds-truncate" title="Biddable" >
                                    <div class="slds-form-element">
                                        <label class="slds-checkbox_toggle slds-grid">
                                            <span class="slds-form-element__label slds-m-bottom_none">Biddable</span>
                                            <ui:inputCheckbox value="" />
                                            <span id="toggle-desc" class="slds-checkbox_faux_container" aria-live="assertive">
                                                <span class="slds-checkbox_faux"></span>
                                            </span>
                                        </label>
                                    </div>
                                </div>
                            </lightning:tile>
                        </li>
                    </ul>
                </lightning:layoutItem>
            </aura:iteration>
TileSampeController.js
({
    doInit : function(component, event, helper) {
        var action = component.get('c.getSegments');
        // Set up the callback
        action.setCallback(this, function(actionResult) {
            console.log('segList***'+actionResult.getReturnValue()[0].customerName);
            component.set('v.Segments', actionResult.getReturnValue());
        });
        $A.enqueueAction(action);
 },
    openSegmentDetail : function(component, event, helper) {
        console.log('Enter Here');
        var index = event.currentTarget.getAttribute('id');
        console.log('index id**'+index);
        var segments = component.get('v.Segments');
        /*
        var evt = $A.get("e.force:navigateToComponent");
        console.log('evt'+evt);
        
        evt.setParams({
            componentDef: "c:SegmentDetail",
            componentAttributes :{ 
                segment:segments[index]
            }
        });
        
        evt.fire();
        */
        var navService = component.find("navService");
        var pageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__SegmentDetail",
                
            }, 
            "state": {
                "c__segment":segments[index]
                //"c__segmentIndex":index
            }
        };
         
        navService.navigate(pageReference);
        //$A.get('e.force:refreshView').fire();
    },
    
})

SegmentDetail.cmp
<aura:component controller="SegmentController" implements="flexipage:availableForAllPageTypes,lightning:isUrlAddressable" access="global" >
*******
<lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                <div class="header-column">
                    <!--<h1> <p class="field-title" title="Field 1">Customer Name</p> </h1>-->
                    <h6> <b><p>{!v.segment.customerName}</p></b> </h6>
                </div>
            </lightning:layoutItem><br/>
            
            <lightning:tabset variant="horizontal">
                <lightning:tab label="Details" >
                    <lightning:layout class="slds-scrollable" multipleRows="true">
                        <lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                            <div class="header-column">
                                <p class="field-title" title="Field 1">Customer Name</p>
                                <p>{!v.segment.customerName}</p>
                            </div>
                        </lightning:layoutItem><br/>
                        
                        <!--    <lightning:layoutItem padding="around-small">
                <div class="header-column">
                    <p class="field-title" title="Field2 (3)">Field 2 (3)
                        <lightning:buttonIcon iconName="utility:down" variant="border-filled" size="small" alternativeText="More Actions" />
                    </p>
                    <p>Eligibltiy</p>
                </div>
            </lightning:layoutItem>
        
     -->   
                        <lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                            <div class="header-column">
                                <p class="field-title" title="Field 1">Segment Number</p>
                                <p>{!v.segment.segmentNumber}</p>
                            </div>
                        </lightning:layoutItem><br/>
</aura:component>

SegmentDetailController.js
({
    BidDetailList : function(component, event, helper) {
        console.log('Entering Bidlevel');
        
        var navService = component.find("navService");
        var pageReference = component.get("v.pageReference");
        var newPageReference = {
            "type": "standard__navItemPage",
            "attributes": {
                "apiName": "All_Segments",
            },
            "state": {
                "c__segmentIndex":undefined
            }
        };
        navService.navigate(newPageReference);
    },
    
    segmentListComponent : function(component, event, helper) {
        console.log('Enter Here');
        /*
        var evt = $A.get("e.force:navigateToComponent");
        console.log('evt'+evt);
        evt.setParams({
            componentDef: "c:TileSample",
            componentAttributes :{ 
            }
        });
        
        evt.fire();
        */
        var navService = component.find("navService");
        var pageReference = component.get("v.pageReference");
        var newPageReference = {
            "type": "standard__navItemPage",
            "attributes": {
                "apiName": "All_Segments",
            },
            "state": {
                "c__segmentIndex":undefined
            }
        };
        navService.navigate(newPageReference);
    },
    doInit : function(component, event, helper) {
        
        console.log('Enter Segment Detail');
        var bids =component.get('v.bids');
        var bid={
            amount :"100$",
            createdDate :"07/30/2018",
            status : "OPEN",
            tourId : "Tour123",
            originCity : "Omaha",
            originState : "Nebraska",
            destinationCity : "San Francisco",
            destinationState : "California",
            Weight : "1000 lbs",
            tourStatus : "Shipped - Through Truck"
        }
        bids.push(bid);
        var bid2={
            amount :"90$",
            createdDate : "07/31/2018",
            status : "OPEN",
            tourId : "Tour123",
            originCity : "Omaha",
            originState : "Nebraska",
            destinationCity : "Los Angeles",
            destinationState : "California",
            Weight : "2000 lbs",
            tourStatus : "Awaiting Shipping - Through Airways"
            }
        bids.push(bid2);
        component.set('v.bids',bids);
        alert("No. of Bids"+bids.length);
        component.set("v.bidsCount",bids.length);
        var pageReference = component.get("v.pageReference");
        /*console.log('Page Reference***'+pageReference);
        console.log('segment***'+pageReference.state.c__segment);
        console.log('segment index#'+pageReference.state.c__segmentIndex);
        */
        component.set("v.segment",pageReference.state.c__segment);
        pageReference = Object.assign(pageReference,{"state": {
                "c__segment":undefined,
            "c__segmentIndex":undefined
        }});
        component.set("v.pageReference",pageReference);
        /*
        
          var newPageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__SegmentDetail",
                
            }, 
            "state": {
                "c__segment":undefined
            }
        };
        
        pageReference = Object.assign(pageReference,newPageReference);
        console.log('page ref updated**');
        //component.set("v.pageReference",pageReference);
        //*/
    }
})