在Angular中更改外部模板

我正在將產品管理管理站點轉換爲使用Angular - 我的所有視圖（產品列表，詳細視圖，編輯等）都顯示在我的管理頁面的ng視圖中。那裏一切都很好。但是，每個產品都有一個鏈接，可以讓我打印它的信息 - 它目前使用與其他外部模板不同的外部模板。在Angular中更改外部模板

處理此問題的角度方法是什麼？

應用：

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-觀爲其他內。我希望它在新窗口中打開 - 我是否會創建一個新的應用程序？

來源

2013-03-12 cyberwombat

您可以編寫一個服務，並在該服務中執行ajax調用以獲取html。現在，你的HTML將包含佔位符，即{{}}，所以你需要一個模板庫（例如鬍子。）來代替那些{{}}與實際數據

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-12 06:36:47 hotienvu

在Angular中更改外部模板

回答

相關問題