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