0

我正在将产品管理管理站点转换为使用 Angular - 我的所有视图(产品列表、详细视图、编辑等)都显示在我的管理页面上的 ng-view 中。那里一切都好。但是,我对每个产品都有一个链接,可以让我打印它的信息——它目前使用与其他产品不同的外部模板。

处理这个的角度方式是什么?

应用程序:

angular.module('myApp', []).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {

    // all routes but print use an index.html template
    $routeProvider.
      when('/', {
        templateUrl: '/partials/order/manage.html',
        controller: ManageOrderCtrl
      }).
      when('/order/:id', {
       templateUrl: '/partials/order/_view.html',
        controller: ViewOrderCtrl
      }).
      when('/order/edit/:id', {
       templateUrl: '/partials/order/_edit.html',
        controller: ViewOrderCtrl
      }).
      // I want this link to not use the same outer template (i.e. something like printer.html as well as use custom headers)
      when('/order/print/:id', {
       templateUrl: '/partials/order/_print.html',
        controller: PrintOrderCtrl
      }).
      otherwise({
        redirectTo: '/'
      });
    $locationProvider.html5Mode(true);
  }]);

在我的管理列表中:

<div ng-repeat="order in orders">
  <a title="Print product sheet" href="/order/print/{{ order._id }}"></a>
</div>

现在这会导致 _print.html 被放置在与另一个相同的 ng-view 中。我确实希望它在新窗口中打开 - 我只是制作一个新应用程序吗?

4

1 回答 1

0

您可以编写一个服务并在该服务内部执行 ajax 调用来获取 html。现在您的 html 将包含占位符,即 {{}},因此您需要一个模板库(例如 mustache)来用真实数据替换那些 {{}}

factory('print', ["$window", function($window) {
/* service in charge of printing */
return function(templateUrl, context) {
    /* send a GET request to templateUrl for template, render the template with context
     * and open the content in a new window.
     */
    $.ajax({
        url: templateUrl,
        async: false,   //otherwise the popup will be blocked
        success: function(html) {
            var template = html.replace('<!DOCTYPE html>\n<html lang="en">\n', '').replace("</html>", ''),
                output = Mustache.render(template, context);
            $window.open().document.documentElement.innerHTML = output;
        }
    });
};

}]);

于 2013-03-12T06:36:47.480 回答