Lightning Navigation HandleClick Error

Question

Following the Component Libary https://hdone-packaging-dev-ed.lightning.force.com/docs/component-library/bundle/lightning:navigation/documentation to use lightning:navigation. When using the OnClick keep getting an uncaught error.

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global">
<aura:attribute name="url" type="String"/>
<aura:attribute name="pageReference" type="Object"/>
<aura:handler name="init" value="{! this }" action="{! c.init }"/>
<lightning:navigation aura:id="navService"/>
<lightning:button label="Navigate" onclick="{!c.handleClick}"/></aura:component>

    ({
    init : function(cmp, event, helper) {
        var navService = cmp.find("navService");
        // Sets the route to /lightning/o/Account/home
        var pageReference = {
            type: 'standard__objectPage',
            attributes: {
                objectApiName: 'Account',
                actionName: 'home'
            }
        };
        cmp.set("v.pageReference", pageReference);
        // Set the URL on the link or use the default if there's an error
        var defaultUrl = "#";
        navService.generateUrl(pageReference)
            .then($A.getCallback(function(url) {
                cmp.set("v.url", url ? url : defaultUrl);
            }), $A.getCallback(function(error) {
                cmp.set("v.url", defaultUrl);
            }));
    }

})

    ({
        handleClick: function(cmp, event, helper) {
            var navService = cmp.find("navService");
            // Uses the pageReference definition in the init handler
            var pageReference = cmp.get("v.pageReference");
            event.preventDefault();
            navService.navigate(pageReference);
        }
    })

Error Uncaught Unknown controller action 'handleClick'

Answer 1

I would have expected the JS controller to throw an error, surprised it did not( i validated in my org). You have 2 outer parentheses ({ }) for your action handlers at the start and end.

Your lightning stucutre should be

({
method1(params){
},
method2(params){
}
})

in your case

({
    init : function(cmp, event, helper) {

    },
    handleClick: function(cmp, event, helper) {

    }
})