ng-click is disabled

[sinjaz]

I have multiple elements inside each slide with ng-click's attached to them. They all seem to be disabled. Anyone know how I can enable them or possible workarounds?

[sinjaz]

After testing some more I found out the ng-click is in fact NOT disabled. The issue is accessing the outer scope which has the definition of the click function. Since the SLICK directive creates its own scope the outer scope is never reached. So the question is how to access to outer (parent) scope, similar to defining the 'data' attribute. Any help would be appreciated.

[sylvanash]

Not sure if it will work, but you could try placing the function inside a model on the scope instead of on the scope directly. So instead of:
$scope.myfunction = function () {....}
You could try something like:
var myfunction = function () {....};
$scope.myobject = { clicked: myfunction };

Again, I haven't exactly tried this, it's just a suggestion

[sinjaz]

I was able to resolve this by passing the scope to slick as the data attribute. This allowed me to access multiple properties of the scope, including functions and model objects.

// 'this' is a reference to $scope
<slick data=this>
    <div ng-click="data.clickHandler()">{{data.model}}</div>
<slick>

[sylvanash]

A good thing you are not working with dynamic data then xD

[jhjwind]

This hack doesn't work with dynamic data. Neither does adding function to the object.

[sylvanash]

@jhjwind I think I worked with something similar. I'll see if I can find a working bit of code later on and post it some time today

[amrfaisal]

Check my answer for Angular use-case:
http://stackoverflow.com/questions/29101254/angularjs-slick-js-carousel-ng-click-not-firing-with-responsive-attribute-settin/30584787#30584787