Force:inputfield for lookup does not clear .

Question

I have a lightning component , where I have a section in it which creates a new record on click of a save . The record gets saved in the backend and it works fine. But the value does not get cleared for the look up field.

Component code: Region
Country
Type
Asset Class

                <aura:renderIf isTrue="{!v.displaySL}">        
                    <div class="slds-col--padded slds-size--1-of-1 slds-large-size--1-of-12">
                        <div class="slds-form-element slds-m-bottom--large">
                            <label class="slds-form-element__label" for="slSelect">Service Line</label>
                            <div class="slds-form-element__control">
                                <ui:inputSelect class="slds-select" aura:id="slSelect" value="{!v.spoc.EMEA_Business_Line__c}" change="{!c.onChange}"/>
                            </div>
                        </div>   
                    </div>
                </aura:renderIf>   

                <aura:renderIf isTrue="{!v.displayMT}">        
                    <div class="slds-col--padded slds-size--1-of-1 slds-large-size--1-of-12">
                        <div class="slds-form-element slds-m-bottom--large">
                            <label class="slds-form-element__label" for="slSelect">Manager Type</label>
                            <div class="slds-form-element__control">
                                <ui:inputSelect class="slds-select" aura:id="mtSelect" value="{!v.spoc.EMEA_Manager_Type__c}" change="{!c.onChange}"/>
                            </div>
                        </div>   
                    </div>
                </aura:renderIf>

                <div class="slds-col--padded slds-size--1-of-1 slds-large-size--2-of-12">
                    <div class="slds-form-element slds-m-bottom--large">
                            <!-- Lookup component -->
                           <!-- <c:svg ariaHidden="true" class="slds-input__icon" xlinkHref="/resource/slds104/assets/icons/utility-sprite/svg/symbols.svg#search"/>-->
                            <label class="slds-form-element__label" for="contactName">Contact Name</label>
                            <force:inputField aura:id="contactName" value="{!v.spoc.CBRE_SPOC_Employee__c}"/>

                    </div>

                </div>
                <div class="slds-col--padded slds-size--1-of-1 slds-large-size--1-of-12 slds-p-top--large">
                    <ui:button aura:id="button" label="Save" press="{!c.createSPOCRecord}" disabled="{!v.buttondisabled}"/>
                </div>

            </div>

Helper Code : createNewSPOC : function (component, helper){ var spoc = component.get("v.spoc"); spoc.sobjectType='SPOC__c';

 // component.set("v.spoc.CBRE_SPOC_Employee__c", component.get("v.contactId"));
  component.set("v.spoc.Account__c", component.get("v.recordId"));
  component.set("v.spoc.EMEA_Is_Matrix_Record__c", true);
    if(component.find("assetSelect").get("v.value") == '--none--'){
        component.set("v.spoc.EMEA_Asset_Class__c", '');
    }
    if(component.find("slSelect").get("v.value") == '--none--'){
        component.set("v.spoc.EMEA_Business_Line__c", '');
    }
  var action    =   component.get("c.createSpoc");
    action.setParams({
        "spoc" :    spoc

    });

    action.setCallback(this, function(a){
        var self=this;
        action.setCallback(this, function(response) {
            self.actionResponseHandler(response, component, self, self.sentSpoc);
        });

        if(a.getState() === "SUCCESS"){

            var newSpoc =   a.getReturnValue();
          //  component.set("v.spoc", newSpoc);
            this.showSaveSuccessful(component);

            component.set("v.showSpocs", true);
            component.set("v.buttondisabled", true);
            helper.getSpocMapAssetClasses(component);
            helper.getSPOCRecordsOfSelectedRegion(component);
            component.set("v.displayAsset", false);
            component.set("v.displaySL", false);
            component.set("v.displayMT", false);

            console.log(component.find("contactName"));
            console.log(component.find("contactName").get("v.value"));
            component.find("regionSelect").set("v.value", '--none--');
            component.find("countrySelect").set("v.value", '--none--');
            component.find("typeSelect").set("v.value", '--none--');
            component.find("assetSelect").set("v.value", '--none--');
            component.find("slSelect").set("v.value", '--none--');
            component.find("mtSelect").set("v.value", '--none--');
            $A.get('e.force:refreshView').fire();

           // helper.getNewSPOC(component);

    }else if(a.getState() === "ERROR"){

             var errors = a.getError();
                if (errors) {

                    if (errors[0]) {
                        this.showErrorMessage(component,errors[0].message);
                    }
                } else {
                    this.showErrorMessage(component, 'Unknown error');
                }
        }
    });
    $A.enqueueAction(action);
},

I am able to clear all the fields , except lookup field , for which force:inputfield is binded.

Answer 1

After toying with force:inputField a bit, I found the following code to clear it's value.

// Clear binded value
var contractLine = component.get('v.contractLine');
contractLine.Product__c = null;
contractLine.Product__r = {'sobjectType': 'Product2'};
component.set('v.contractLine', contractLine);    

// Clear product lookup
var productLookup = component.find('Product').get('v.body')[0];
productLookup.updateValues();