來自控制器的角度指令訪問模板元素

我正在使用角度指令向各種元素添加可重複使用的彈出窗口。由於樣式限制，我不需要將彈出框添加到元素，而需要將其添加到文檔主體。我後來想要在我的控制器中訪問它 - 我將如何去做這件事？來自控制器的角度指令訪問模板元素

.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

來自控制器的角度指令訪問模板元素

回答

相關問題