来自控制器的角度指令访问模板元素

我正在使用角度指令向各种元素添加可重复使用的弹出窗口。由于样式限制，我不需要将弹出框添加到元素，而需要将其添加到文档主体。我后来想要在我的控制器中访问它 - 我将如何去做这件事？来自控制器的角度指令访问模板元素

.controller 'slUserCtrl', ($element) -> 
    $element.popup 
     hoverable: true 
     position: 'bottom right' 
     popup: # What do I put here to get the "template" DOM element? 

.directive 'slUser', ($document) -> 
    template = $templateCache.get 'users/sl-user.html' 

    return { 
     restrict: "A" 
     controller: 'slUserCtrl' 
     compile: (elem, attrs) -> 
     angular.element(document.body).append template 
    }

来源

2015-11-05 Harangue

当您想通过将模式弹出框附加到文档正文来显示模式弹出框时，您正在操作DOM。有一个地方DOM操作是好的，这就是指令的链接功能。

var app = angular.module('app',[]); 
 
app.controller('ctrl', function($scope) { 
 
}); 
 

 
app.directive('modal', function() { 
 
    return { 
 
    restrict: 'A', 
 
    transclude: 'element',  
 
    controller: function($rootScope) { 
 
     $rootScope.dialog = { show: false }; 
 
    }, 
 
    link: function(scope, element,attr,ctrl, transclude) {  
 
     transclude(function(clone, scope) { 
 
     scope.$watch('dialog.show', function (val) { 
 
      if (val) { 
 
      clone.css('display', 'block'); 
 
      } 
 
      else { 
 

 

 
      clone.css('display', 'none');     
 
      } 
 
     }); 
 
     angular.element(document.body).append(clone); 
 
     }); 
 
    } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app"> 
 
    
 
    <div ng-controller="ctrl"> 
 
    Hello World! 
 
    <button ng-click="dialog.show = !dialog.show">Open Modal </button> {{test}} 
 
    <div modal> 
 
     This is a modal dialog 
 
    </div> 
 
    </div> 
 
    
 
</body>

来源

2015-11-05 07:53:59 pixelbits

的问题是，我有很多这些弹出连接到带有NG重复的元素。有没有办法解决这个没有rootcope？ – Harangue

来自控制器的角度指令访问模板元素

回答

相关问题