在AngularJS中单击按钮打开一个新选项卡答案

【问题标题】：Open a new tab on button click in AngularJS在AngularJS中单击按钮打开一个新选项卡
【发布时间】：2013-07-20 01:43:54
【问题描述】：

<button type="button" class="btn btn-primary" ng-click="openTab()">new tab</button>

openTab = function () {
  $http.post('www.google.com');
}

当您单击“openTab”按钮时，我想要发布一个要求并在新选项卡中打开响应 html。 $http 没有办法做到这一点。我认为这可能很简单，但我找不到方法。

【问题讨论】：

你能接受这个解决方案吗？我投票给@Aaron 一个:)

标签： javascript angularjs

【解决方案1】：

您可以使用 $window 服务here 在您的控制器中完成所有这些操作。 $window 是全局浏览器对象窗口的包装器。

为了使这项工作如下注入 $window 到您的控制器中

.controller('exampleCtrl', ['$scope', '$window',
    function($scope, $window) {
        $scope.redirectToGoogle = function(){
            $window.open('https://www.google.com', '_blank');
        };
    }
]);

这在重定向到动态路由时效果很好

【讨论】：

Chrome 会锁定此弹出窗口。我如何识别它已被锁定并通知用户？
它在 chrome 和 firefox 中运行良好，但在 IE 中用户退出并重定向到登录页面。是否有一些解决方法可以解决 IE 的问题

【解决方案2】：

我用这种方法解决了这个问题。

<a class="btn btn-primary" target="_blank" ng-href="{{url}}" ng-mousedown="openTab()">newTab</a>

$scope.openTab = function() {
    $scope.url = 'www.google.com';
}

【讨论】：

这个技巧非常棒，特别是对于正在处理Chrome安全可以锁定脚本手动打开的新标签页的问题的人。

【解决方案3】：

正确的 HTML 方式：只需用锚元素包围您的按钮并添加属性 target="_blank"。就这么简单：

<a ng-href="{{yourDynamicURL}}" target="_blank">
    <h1>Open me in new Tab</h1>
</a>

您可以在控制器中设置的位置：

$scope.yourDynamicURL = 'https://stackoverflow.com';

【讨论】：

【解决方案4】：

您应该使用$location 服务

Angular 文档：

【讨论】：

位置不允许您打开新标签。