javascript - How to locale correctly controlle AngularJS in page? -
there items div
@ page:
<body> <div id="block"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div> <div class="modal"></div> </body>
and 1 modal block class="modal"
after items.
i want after click .item
shows modal block, have added ng-controller="blockcontroller"
@ parent block id="block"
:
<div id="block" ng-controller="blockcontroller"> ... </div>
at modal block there buttons, methods realization want add on controller block controller
, modal not in border of visible controller.
can add yet same controller to: <div class="modal" ng-controller="blockcontroller"></div>
make common functionality in 1 controller? tried this, troubles visible $scope
variables in case:
anjs
$scope.clickspam = function (id, type){ $scope.id = id; // have value id }
template html:
{{id}} // here not displayed value
one of solutions can use controller modal contains own features
<div class="modal" ng-controller="modalcontroller"></div>
now, inside blockconroller
can still access $scope
of modalcontroller
:
angular.element($(".modal")).scope(); // returns modalcontroller's $scope
note have use id on modal if have many modals different controllers.
your code :
html code:
<div class="modal" id="modalid" ng-controller="modalcontroller"></div>
javascript code :
angular.element($("#modalid")).scope(); // returns modalcontroller's $scope
another problem may find, is change variable modalcontroller scope blockcontroller :
angular.element($(".modal")).scope().id = "something";
your {{ id }}
binding not work unless call $apply
method :
angular.element($(".modal")).scope().$apply()
Comments
Post a Comment