使用AngularJS在新窗口中打开链接

Question

有没有办法告诉AngularJS我希望在用户点击它们时在新窗口中打开链接？

使用jQuery我会这样做:

jQuery("a.openInNewWindow").click( function() {
    window.open(this.href);
    return false;
})

是否与AngularJS等效？

Answer 1

这是一个将添加target="_blank"到<a>具有href属性的所有标记的指令.这意味着他们将在一个新窗口中打开.请记住,Angular中的指令用于任何dom操作/行为.现场演示(点击).

app.directive('href', function() {
  return {
    compile: function(element) {
      element.attr('target', '_blank');
    }
  };
});

这是相同的概念,具有较小的侵入性(因此它不会影响所有链接)和更具适应性.您可以在父元素上使用它以使其影响所有子链接.现场演示(点击).

app.directive('targetBlank', function() {
  return {
    compile: function(element) {
      var elems = (element.prop("tagName") === 'A') ? element : element.find('a');
      elems.attr("target", "_blank");
    }
  };
});

老答案

看起来你只想"target="_blank"在你的<a>标签上使用它.这有两种方法:

<a href="//facebook.com" target="_blank">Facebook</a>
<button ng-click="foo()">Facebook</button>

JavaScript的:

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope, $window) {
  $scope.foo = function() {
    $window.open('//facebook.com');
  };
});

现场演示(点击).

以下是Google文档$window:http://docs.angularjs.org/api/ng.$window

您可以使用window,但最好使用依赖注入,传入角度$window以进行测试.

Answer 2

这个对我有用.将$window服务注入控制器.

$window.open("somepath/", "_blank")

Answer 3

您可以使用:

$window.open(url, windowName, attributes);

Answer 4

这是你的按钮的代码

<a href="AddNewUserAdmin" 
   class="btn btn-info " 
   ng-click="showaddnewuserpage()">
  <span class="glyphicon glyphicon-plus-sign"></span> Add User</a>

在控制器中只需添加此功能.

 var app = angular.module('userAPP', []);

app.controller('useraddcontroller', function ($scope, $http, $window) {

$scope.showaddnewuserpage = function () {

    $window.location.href = ('/AddNewUserAdmin');
}

});