在指令中使用window.open(Use window.open in a directive)

我试图触发$window.open(url, windowName, attributes); 在我与NG-点击角应用

我已经定义的指令和功能包window.open触发多亏了NG-点击链接到我的模板的按钮：

myApp.directive('myModal', ['$log', function ($log, $window) {
    return {
        restrict: 'E',

        templateUrl: 'modal-tpl',

        replace: true,

        transclude: true,

        link: function (scope, window) {
            scope.openWindow = function(){
                window.open('https://myLink', 'Google', 'width=500,height=400');
               //some other code
            };
        }
    };
}]);

而在我的HTML：

   <button type="submit" class="cta main right ease"ng-click="openWindow()">open window</button>

出于某种原因，当我点击按钮的窗口不会打开。 这有什么错我的代码？

Answer 1:

使用链接你不能注入窗口，你可以简单地使用本地JavaScript 窗口对象

例：

JS：

var app=angular.module('App', []);
app.directive('myModal', ['$log', function ($log) {
    return {
        restrict: 'EA',

        link: function (scope,element) {
            scope.openWindow = function(){
                window.open('https://myLink', 'Google', 'width=500,height=400');
               //some other code
            };
        }
    };
}]);

HTML：

<div ng-app="App"  >
 <button type="submit" my-Modal="" class="cta main right ease"ng-click="openWindow()">open window</button>
</div>

活生生的例子： http://jsfiddle.net/choroshin/crt45/1/

Answer 2:

你应该做的是这样的：

myApp.directive('myModal', ['$log', '$window', function ($log, $window) {
    return {
        restrict: 'E',

        templateUrl: 'modal-tpl',

        replace: true,

        transclude: true,

        link: function (scope) {
            scope.openWindow = function(){
                $window.open('https://www.google.pl', 'Google', 'width=500,height=400');
               //some other code
            };
        }
    };
}]);

在$窗口服务是一个指令的依赖，这将是可用的链接函数内。

文章来源: Use window.open in a directive