Comment ouvrir un nouvel onglet dans le navigateur en utilisant $emplacement, angulaire?

j'ai contrôleur 'reportCtrl' et HTML qui représente 6 tableaux avec des données et seulement plusieurs lignes que je montre à la fois.

app.js

var appReport = angular.module('myAppReport', []);

appReport.config(['$routeProvider', function($routeProvider) {
            $routeProvider.when('/showreport', {templateUrl: 'app/reports/reportsView.html', controller: 'reportCtrl'});
            $routeProvider.when('/showreport/:type', {templateUrl: 'app/reports/reportsView.html', controller: 'reportCtrl'});

chaque table a un bouton qui sur le clic, devrait ouvrir le nouvel onglet dans le navigateur avec la table étendue:

scope.onClick = function(path){
    var real_path = $location.path() + '/' + path + '/';
    $location.path( real_path );
    // $window.open($location.path()); // doesn't work
};

Par exemple, j'ai vue de la racine de l'URL:

http://dev.test.com/reports/date/#/showreport

Maintenant, après avoir pressé le bouton je veux créer :

http://dev.test.com/reports/date/#/showreport/table_name

et ouvrir dans un nouvel onglet. Comme vous le voyez, j'ai essayé $window.open($location.path()); mais ça ne fonctionne pas, rien ne se passe.

Merci,

24
demandé sur Alfred Huang 2013-12-29 01:09:10

7 réponses

vous ouvrez une nouvelle fenêtre en utilisant une autre fonction qui pourrait être confondue.

essayez de passer la chaîne dans le $window.open(real_path) où real_path est une chaîne contenant le chemin que vous voulez parcourir

22
répondu Rayton Kiwelu 2014-06-20 14:20:27

si vous voulez ouvrir une page angulaire dans un nouvel onglet sur ctrl + cliquez ou dans le même onglet, puis essayez ceci: -

HTML:

<a ng-click="navigationUrl($event)">My Link</a>

JS:

    var navigationUrl = function (event) {
            if (event.ctrlKey) {
                window.open(url, '_blank'); // in new tab
            } else {
                $location.path(url); // in same tab
            }
        };
16
répondu Rubi saini 2015-05-21 06:23:21

une option de plus est d'utiliser ng-href

HTML:

 <a  ng-href="#/courses/{{employee.courseId}}/employees/{{employee.id}}" 
      target="_blank"> {{employee.employeeNumber}}
 </a>

Où url est basée sur l'endroit où vous souhaitez rediriger

4
répondu Rama 2015-09-09 08:12:49

pour ouvrir une nouvelle vue dans une nouvelle fenêtre, exécutez le code suivant:

window.open($location.$$absUrl.replace($location.$$path,NEW_PATH), '_blank');
1
répondu Amalraj K R 2016-06-10 12:01:00

Cela a fonctionné pour moi.

HTML: <div ng-click="OpenBrowserInNewTab(someKeyValue)"</div>Click Me </div>

Le Contrôleur:

`$scope.OpenBrowserInNewTab = (someKeyValue) ->
    tabWindowId = window.open('/abcdef/ghijk/' + someKeyValue + '', _blank')

    $http.post("/abcdef/ghijk/#someKeyValue", data).then (response) ->
        tabWindowId.location.href = response.headers('Location')
        return
    return`    
0
répondu Timothy Ingledue 2015-03-25 22:47:35

ouverture de la vue dans le nouvel onglet avec le paramètre angulaire

   <a  target="_blank" class="btn" data-ng-href="@Url.Action("Hotel", "Home")?hotelCode={{hotel.code}}"> Click Hear</a>
0
répondu sanjeewa 2016-12-20 18:15:35

bien que la réponse la plus votée ici puisse fonctionner pour la plupart des scénarios, je tiens à ajouter la façon dont j'ai trouvé pour atteindre ce que L'OP veut (j'avais besoin de cela aussi):

var viewPath = '/InsideMyView';
var currentPath = window.location.href.substr(0, window.location.href.indexOf('#') + 1);
var fullPath = currentPath + viewPath;
$window.open(fullPath, '_blank');

Explication: vous avez juste besoin d'obtenir L'URL racine de votre application, et vous pouvez utiliser # dans l'url (qui est ajouté par angulaire), puis concaténer le chemin de la vue pour obtenir l'url complète.

0
répondu Alisson 2017-06-02 11:56:28