javascript - Passing a model value through a popover in AngularJS -
this question has answer here:
i'd use bootstrap popover (from angular-bootstrap) modify model value on $scope
of controller. seems popover template breaking connection.
i made small example show issue:
directive 1 (master-directive
) takes in model isolate scope property. it's template button displays popover. template popover shows directive 2 (sub-directive
) fed model value through isolate scope property, , contain sort of ui control modify property (in demo, mouse click).
normally changes propagate controller (sub-directive
model two-way bound master-directive
model two-way bound controller model. however, when template contains sub-directive
used in popover, two-way binding between sub-directive
, master-directive
broken. changes model in sub-directive
stay local directive, , not propagated upwards.
relevant plunkr: http://plnkr.co/edit/3znmnutajxsahjjcdkkj?p=preview
here same plunkr without popover, demonstrating works: http://plnkr.co/edit/mr4djvzcvpeukgdzpyvv?p=preview
is there step missing bridge gaps introduced popover module?
if store data in object, rather javascript primitive (number), problem resolved. plunkr.
store data in object this:
$scope.data = { num: 5 };
instead of this:
$scope.num = 5;
my assumption popover creating child scope. b/c of way prototypical inheritance works, number property in child scope shadows number property in parent (eg. parent's value doesn't change when child's does).
Comments
Post a Comment