2013-08-06 19 views
7

Mam proste dyrektywę podręczne podobną do https://github.com/angular-ui/bootstrap/blob/master/src/modal/modal.jsPrzełęcz element kątowy dyrektywy

muszę umieścić moje okienko blisko elementu, który zainicjował otwarte.

Jaki jest najlepszy sposób na zrobienie tego? Czy przechwycenie inicjatora za pomocą ng-click = "open ($ event)" i przejście do pracy dyrektywy? (Oto próbka tego elementu przechwytywania http://jsfiddle.net/Amnesiac/5z5Qz/3/)

$scope.open= function (e) { 
    var elem = angular.element(e.srcElement); 
} 

Jak następnie przekazać ten angular.element (e.srcElement) do dyrektywy? (Dyrektywa następnie zrobić kilka obliczeń na podstawie pozycji, które przeszły elementu DOM i ponownym położeniu podręcznego)

+0

Myślę, że chcesz związać kontroler w dyrektywie tak yo możesz kontrolować zakres swoich funkcji. –

Odpowiedz

8

przekazać go jak każdy inny własności zakres, np modal el="clickedElement":

<button id="myId" ng-class="{'blueBg': blueBg}" ng-click="hi($event)">click me</button> 
<div modal el="clickedElement"></div> 

angular.module('Test',[]) 
.controller('Foo', function ($scope, $element) { 
    $scope.blueBg = false; 
    $scope.hi = function (ev) { 
     $scope.blueBg = true; 
     $scope.clickedElement = angular.element(ev.srcElement); 
    } 
}) 
.directive('modal', function() { 
    return { 
     link: function(scope, element, attrs) { 
      scope.$watch(attrs.el, function(value) { 
       if(value !== undefined) { 
        console.log('element=',value); 
... 

fiddle

+0

Jak uzyskać wartość właściwości width z tej "wartości"? – dzolnjan

+0

@dzolnjan, element DOM jest dostępny jako 'value [0]', więc szerokość jest dostępna jako 'value [0] .clientWidth'. –

+0

Czy to nadal najlepszy sposób na zrobienie tego? – prasanthv