在新选项卡/窗口中打开新视图答案

【问题标题】：Open new view in new tab/window在新选项卡/窗口中打开新视图
【发布时间】：2015-11-09 17:24:00
【问题描述】：

我正在尝试处理“滚轮单击”和“右键单击 > 在新选项卡/窗口中打开”，以便在新选项卡/窗口中加载目标视图。

假设在我的一个观点中，我有这样的事情：

  <li><a href="javascript:void(0)" ng-click="h.changeView('projects')">Time Tracking</a></li>
  <li><a href="javascript:void(0)" ng-click="h.changeView('requests')">Dashboard</a></li>

我的控制器中的changeView() 函数如下所示：

  this.changeView = function(viewPath) {
    $location.path(viewPath);
  };

还有这样的路由配置：

// Routes configuration
app.config(['$routeProvider', function($routeProvider) {
  $routeProvider
    .when('/', {
      templateUrl: 'requests/requestsList.html',
      controller: 'requestsController',
      controllerAs: 'r'
    })
    .when('/requests', {
      templateUrl: 'requests/requestsList.html',
      controller: 'requestsController',
      controllerAs: 'r'
    })
    .when('/projects', {
      templateUrl: 'projects/projectsList.html',
      controller: 'projectsController',
      controllerAs: 'p'
    })
    .otherwise({
      redirectTo: '/'
    });
}]);

如何处理在不同选项卡/窗口中显示新视图？

另外，我的$routeProvider 中是否有语法允许我将/ 和/requests 组合在同一个when(...) 中？

【问题讨论】：

我不知道如何以与 Angular 交互的方式执行此操作，但通常您会将真实 URL 放入 href，然后事件处理函数将读取该值并使用它描述要动态加载的内容。
该 url 将指向一个视图，在我的情况下，这只是要加载的页面的一部分。
那你做错了网址。 URL 应该指向完整的页面（即完整的页面应该由服务器提供）。当您使用 JavaScript 更改部分内容时，您应该使用 History API (pushState & co) 将 URL 更新为服务器将使用 JS 逐个交付您刚刚构建的页面的 URL。
我有一个主页，其中包含：<div header></div> <ng-view></ng-view> <div footer></div>。当我调用changeView() 时，我只更改<ng-view>，我不会重新加载我的页眉和页脚。这是一种不好的做法吗？
那是“当你用 JavaScript 改变部分内容时”部分。没关系。您只需要完成其余的工作。

标签： javascript html angularjs route-provider

【解决方案1】：

简单的 HTML 将帮助您。在您的 HTML 代码中添加 target="_blank"

【讨论】：

当左键单击元素时，这将导致在新选项卡中打开我的视图，不是吗？
@Ellone — 更有可能在新窗口中打开javascript:void()。

【解决方案2】：

尝试使用 $window 服务：

this.changeView = function(viewPath) {
  $window.open(viewPath, '_blank');
};

【讨论】：

问题是询问如何在新标签/窗口中打开正确的内容当用户明确选择在新标签/窗口中打开时，正常点击链接时不会。