Открыть ссылки в новом окне с помощью AngularJS

Ответ 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');
  };
});

Живая демонстрация здесь (нажмите).

Вот документы для $window: http://docs.angularjs.org/api/ng.$window

Вы можете просто использовать window, но лучше использовать инъекцию зависимостей, передавая в Angular $window для целей тестирования.

Ответ 2

вы можете использовать:

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

Ответ 3

Это работает для меня. Внесите $window услугу в контроллер.

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

Ответ 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');
}

});

Ответ 5

@m59 Директивы будут работать для ng-bind-html, вам просто нужно подождать $viewContentLoaded для завершения

app.directive('targetBlank', function($timeout) {
  return function($scope, element) {
    $scope.initializeTarget = function() {
      return $scope.$on('$viewContentLoaded', $timeout(function() {
        var elems;
        elems = element.prop('tagName') === 'A' ? element : element.find('a');
        elems.attr('target', '_blank');
      }));
    };
    return $scope.initializeTarget();

  };
});

Ответ 6

Я написал небольшую сущность, которая, по моему мнению, может быть очень полезной для любого, кто ищет решение этой проблемы: внешняя ссылка

Что он делает, так это добавляет атрибуты target="_blank" к элементам привязки, которые будут привязываться к домену, отличному от текущего. Вы можете исправить его до того, что сочтете нужным.