如何使用ASP.NET Core SpaServices和Angular Universal更新HTML標頭？

我在https://github.com/aspnet/JavaScriptServices/tree/dev/templates/Angular2Spa上使用模板作爲Angular Universal SPA的起點。它呈現的角根組件，如下所示：如何使用ASP.NET Core SpaServices和Angular Universal更新HTML標頭？

@{ 
    ViewData["Title"] = "Home Page"; 
} 

<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>

我想我的一些角度成分的修改HTML頭的內容（如設置標題標籤，或增加額外的meta標籤）。

請記住，該模板使用Razor渲染頁面的頭部分，有沒有關於如何實現這一點的任何建議？

我使用Razor處理的唯一事情是asp-append-version標籤助手，因此將所有HTML渲染移動到Angular組件中將是一個選項（前提是我有一種方法來保持緩存清除不知何故）。

在此先感謝！

來源

2017-01-02 Adam Stiskala

如果你想從服務器到客戶端傳遞數據，看看在這裏DOC： https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#microsoftaspnetcorespaservices下「將數據從.NET代碼傳遞到JavaScript代碼」部分 – DOMZE

謝謝 - 但除非有辦法在客戶端應用asp-append-version標籤助手，否則我不確定這將如何幫助我。據我所知，該助手會爲每個文件生成一個文件版本哈希值，因此需要在客戶端上下文中執行一些操作。 –

您可以使用標題服務來設置文檔或窗口標題。

樣品implementation-

import { Component } from '@angular/core'; 
import { Title }  from '@angular/platform-browser'; 

@Component({ 
selector: 'my-app', 
template: 
    `<p> 
    Select a title to set on the current HTML document: 
    </p> 
    <ul> 
    <li><a (click)="setTitle('Good morning!')">Good morning</a>.</li> 
    <li><a (click)="setTitle('Good afternoon!')">Good afternoon</a>.</li> 
    <li><a (click)="setTitle('Good evening!')">Good evening</a>.</li> 
    </ul> 
    ` 
}) 

export class AppComponent { 
    public constructor(private titleService: Title) { } 
    public setTitle(newTitle: string) { 
    this.titleService.setTitle(newTitle); 
    } 
}

工作plunker從可用here

來源

2017-01-02 08:10:12 Sanket

這似乎在客戶端工作正常，但服務器端產生一個錯誤 - 不能創建屬性'標題'字符串'' –

@AdamStiskala我正在使用這個angular2 asp.net核心[模板]（https：///marketplace.visualstudio.com/items?itemName=MadsKristensen.ASPNETCoreTemplatePack）和標題服務適用於我。 – Sanket

謝謝@Sanket，但是該模板似乎只適用於客戶端應用程序。我正在使用[Angular Universal]（https://universal.angular.io/）。該服務適用於客戶端呈現，但不適用於服務器端呈現。 –

角文檔在aspnetcore-angular2-universal他們實現了一個很好的meta.service.ts用於處理操作頭的東西像標題和meta標籤。它在客戶端的偉大工程，但不幸的是，如前所述here，該服務只能在瀏覽器中使用：

//直到我們可以得到完整的HTML文檔（這是一個.NET的問題，因爲我們從來沒有https://stackoverflow.com/a/42377704/1694015

考慮我們所需要的標題\元：如果不使用ASPNET芯和具有角萬向節點粘着這可以如這裏所描述來進行傳遞整個文件（僅根應用程序））

在服務器上爲第一次調用渲染的標籤（爲了社交爬蟲的目的 - angul ar可以在客戶端導航之後照顧它），這是否是在mvc控制器的動作中檢測路線的好方法，並將標題和元標題與ViewData一起傳遞給呈現的mvc視圖並將其設置在那裏？

來源

2017-02-23 11:23:34 Issac

如何使用ASP.NET Core SpaServices和Angular Universal更新HTML標頭？

回答

相關問題