Question

我使用：

使用ASP.NET核心设置Angular 2

dotnet new --install Microsoft.AspNetCore.SpaTemplates::*

我遵循标准设置，但App.component.html正在复制html和body标签。

当按下控制U（查看源）时，html看起来像：

<html>
    <head>
    ....
    </head>
    <body>
    <app>
    <html>
    <head>
    <style>
    ...
    </style>
    </head>
    </app>
     </body>
    </html>
</app>
...
</body>
</html>

删节我的所有组件都没有html或body标签。唯一具有html或body标签的是初始页面

我的_Layout.cshtml html：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>@ViewData["Title"] - HotSnail</title>
        <base href="/" />
        <script src="~/content/modules/jquery/jquery-3.2.1.min.js"></script>
        <script src="~/content/modules/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
        <link rel="stylesheet" href="~/dist/vendor.css" asp-append-version="true" />
        <link href="~/content/modules/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet" />
        <link href="~/content/modules/animate/animate.css" rel="stylesheet" />
        <link href="~/content/global.css" rel="stylesheet" />
    </head>
    <body>
        @RenderBody()

        @RenderSection("scripts", required: false)
    </body>
</html>

我的Index.cshtml

<script src="~/dist/vendor.js" asp-append-version="true"></script>
@section scripts {
    <script src="~/dist/main-client.js" asp-append-version="true"></script>
}

上面的代码是应该提供的，现在角度的第一位应该是app.component

app.component.html

    <ribbon></ribbon>
<div id="content">
    <router-outlet></router-outlet>
</div>

ribbon.component.html：

<div id="ribbon">

<span class="ribbon-button-alignment">
    <span id="refresh" class="btn btn-ribbon" data-action="resetWidgets" data-title="refresh" rel="tooltip" data-placement="bottom" data-original-title="<i class='text-warning fa fa-warning'></i> Warning! This will reset all your widget settings." data-html="true" data-reset-msg="Would you like to RESET all your saved widgets and clear LocalStorage?"><i class="fa fa-refresh"></i></span>
</span>

<!-- breadcrumb -->
<ol class="breadcrumb"><li>Home</li><li>Outlook</li><li>Inbox</li></ol>
</div>

这是应该在第一页上注入的所有组件

UPDATE * 所以我做了一些研究，似乎是一个已知的bug。正如它在这里所说： https://github.com/aspnet/JavaScriptServices/issues/662

我无法安静地弄清楚他们的黑客解决方案

Here is hacky code that fixes this:

return requestZone.run＆gt;（（）=＆gt;   platform.serializeModule（AppModule））。then（html =＆gt; {resolve（{html：   html.slice（27，html.length - 14）.replace（＆＃39;＆＃39;，＆＃39;＆＃39;）}）; }，   拒绝）;

同样在index.cshtml中我建议将应用程序更改为div，因为我们已经   有来自环球公司的应用标签。
     载入中...

我不确定该代码会去哪里..

更新

这也发生在执行

时创建的DEFAULT项目中

dotnet new angular

有没有人知道谁维护这些模板，因为我想向开发团队发布错误

Answer 1

角度5的相同问题。

我修改了它就像上一篇关于https://github.com/aspnet/JavaScriptServices/issues/662的评论的建议（salarcode的最后评论）：

boot.server.ts文件将代码更改为：

resolve({
html: (() => {
    let apphtml = state.renderToString();
    apphtml = apphtml.replace('<html><head><style>', '<style>').replace('</head><body><app', '<app').replace('</app></body></html>', '</app>');
    return apphtml;
})()});

Angular 2与ASP.NET Core重复

1 个答案: