Angularjs $ state відкрити посилання в новій вкладці

81

Я намагаюся реалізувати функцію "відкрити посилання в новій вкладці" за допомогою функції $ state.go. Було б чудово, якби там було щось подібне:

$state.go('routeHere', {
    parameter1 : "parameter"
    }, {
    reload : true,
    newtab : true // or smth like target : "_blank"
});

Чи можна це зробити за допомогою AngularJS?

angularjs angular-ui-router angular-ui

— Алекс Арванітідіс
джерело

Редагування у питанні, в якому сказано, що ви вирішили це за допомогою наступного коду, здається зайвим. Тобто. це передбачається тим фактом, що ви обрали його як прийняту відповідь.

— Адам Цернер,

Виправлено, видалено редагування.

— Alex Arvanitidis

Ви можете знайти відповідь тут Angularjs $ state відкрите посилання в новій вкладці

— Dalorzo

153

Оновлення: Добре, я щойно вирішив його, використовуючи такий код:

var url = $state.href('myroute', {parameter: "parameter"});
window.open(url,'_blank');

— Алекс Арванітідіс
джерело

18

Чи не повинно це бути вікно $ для кращої практики?

— цуз

3

Ви впевнені, що параметр можна передати в нове вікно?

— hjl

Так @elaijuh вони будуть передані

— Мануель Ді Іоріо

@alex я хочу націлити певне вікно, тому спробував window.open (url, 'myWindow'); але це не працює. Будь-яка допомога?

— mhd

1

Зверніть увагу, що якщо ви відкриваєте посилання з javascript таким чином і змінюється базова URL-адреса, швидше за все, браузер заблокує його, сказавши, що сайт намагався відкрити спливаюче вікно, але якщо користувач приймає або уповноважує ваш веб-сайт це робити, це буде робота.

— GabLeRoux

55

Я просто спробував це - мабуть, додавши target="_blank"роботи з ui-sref:

<a ui-sref="routeHere" target="_blank">A Link</a>

Зберігає проблеми з додаванням коду до контролера та надає вам URL-адресу при наведенні, як і будь-яке звичайне посилання. Безпрограшний!

— Патрік Калуло
джерело

3

це працює лише на <a>. "target", очевидно, не працює на інші елементи. тобто <button ui-sref = "routeHere" target = "_ blank"> Посилання </button>

— Луїс,

2

Кнопки @Luis не мають атрибута Target, так що так, це не буде працювати

— gerl

1

@Luis Можливо, ви можете використовувати класи, пов’язані з кнопками, і роль як кнопки для прив’язаного тегу, щоб зробити його схожим на кнопку. Наприклад:<a ui-sref="routeHere" target="_blank" class="btn btn-primary" role="button">A Link</a>

— Сафван

7

У мене була подібна проблема, спробуйте це, якщо вам нічого з попередніх відповідей не підходить.

var url = '#' + $state.href('preview');
window.open(url,'_blank');

Отже, під час роботи в localhost, без додавання, '#'він просто перенаправляв на

localhost / попередній перегляд

, замість

localhost / Project_Name / # / preview

Я не беруся тут про передачу даних, просто щоб відкрити $ state у новій вкладці.

— Діпак Банді
джерело

6

Це може не працювати на localhost, якщо ваш додаток знаходиться в підпапці. У мене було насправді те саме питання.

Я пробував в Інтернеті, і це працювало, як очікувалось, використовуючи:

<a ui-sref="routeHere" target="_blank">Link</a>

— ФранческоМуссі
джерело

4

ui-sref="routeHere" href=""target="_blank"

цей код вирішив мою проблему.

використовувати це в прив'язковому тегу.

— Зубайр садик
джерело

4

Найкраща відповідь, яку я знайшов, - це розширення ui.router, оскільки ця функція не існує вбудованою. Повну інформацію можна знайти тут:

Розширення $ state.go користувальницького маршрутизатора Angular 1.x

Однак, ось моє коротке пояснення того, що потрібно зробити, додайте це до app.js або angular app init файл:

angular.module("AppName").config(['$provide', function ($provide) {
    $provide.decorator('$state', ['$delegate', '$window',
        function ($delegate, $window) {
            var extended = {
                goNewTab: function (stateName, params) {
                    $window.open(
                        $delegate.href(stateName, params, { absolute: true }), '_blank');
                }
            };
            angular.extend($delegate, extended);
            return $delegate;
        }]);
}]);

У вашому коді

Ви зможете зробити:

$state.goNewTab('routeHere', { parameter1 : "parameter"});

— Далорцо
джерело

2

Спробуйте це!

<a ui-sref="routeHere({parameter: vm.parameter})" target="_blank"></a>

— Міко
джерело

Це не має значення, я не сказав, що мені потрібно додати параметри до маршруту, який я викликаю, я сказав, що хочу відкрити цей маршрут у новій вкладці.

— Alex Arvanitidis

Це може бути актуальним для багатьох людей. Я просто цим користувався. Тут слід згадати те, що ім’я параметра має бути в одинарних лапках. <a ui-sref="routeHere({'parameter': vm.parameter})" target="_blank"> </a>

— Судхір Мухаммед