Angularjs ui for bootstrap

Question

i'm using the Angularjs ui for bootstrap library. In particular im, wanting to customise the the behaviour of the "collapse" directive. Currently, if i have more than one collapsable section on a page itcollapses them all at the same time. I would like to seperate them out so i can know which element triggered the event. And collapse only that section. Ive tried a few different ways including adding the $event expression inside ng-click but its coming back undefined.

I was hoping that someone could help me fix this code please?

.directive("collapse", ["$transition", function (e, $event) { var t = function (e, t, n) { t.removeClass("collapse"), t.css({height: n}), t[0].   offsetWidth, t.addClass("collapse") };

return{link: function (n, a, i) { var r, o = !0; n.$watch(function () { return a[0].scrollHeight }, function () { 0 !== a[0].scrollHeight && (r || (o ? t(n, a, a[0].scrollHeight + "px") : t(n, a, "auto"))) }), n.$watch(i.collapse, function (e) { console.log(r); e ? u() : c() //removed for testing }); var l, s = function (t) { return l && l.cancel(), l = e(a, t), l.then(function () { l = void 0 }, function () { l = void 0 }), l }, c = function () {

o ? (o = !1, r || t(n, a, "auto")) : s({height: a[0].scrollHeight + "px"}).then(function () { r || t(n, a, "auto") }), r = !1 }, u = function () { r = !0, o ? (o = !1, t(n, a, 0)) : (t(n, a, a[0].scrollHeight + "px"), s({height: "0"})) } }} }])

shouldn't all collapse if you set different variables for each one to define collapse state. Create a demo in plunker or jsfiddle.net that replicates your issue — charlietfl
– charlietfl, Commented Nov 7, 2013 at 4:48

charlietfl · Accepted Answer · 2013-11-07 04:56:41Z

2

Your problem is likely that you have used the same scope variable for collapse for each of the inidividual instances. This would wire them all together.

As you can see from this demo, they play well together when the variables are different

DEMO

answered Nov 7, 2013 at 4:56

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angularjs ui for bootstrap

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related