2

尝试在 Visual Studio 社区的 ASP.NET 5 中制作自定义聚合物元素。我选择“新建项目”->“Web”->ASP.NET Core Web 应用程序(.NET Core)。在解决方案资源管理器中,我添加了一个新文件“ helloworld.html ”,在这个文件中,我使用以下代码创建了一个新的聚合物元素:

<link rel="import" href="https://polygit.org/components/polymer/polymer.html">
<dom-module id="hello-world">
    <style></style>
    <template>
    <h1>Hello world</h1>
    </template>
</dom-module>
<script>
    Polymer({
        is: "hello-world"
    });
</script>

接下来,我尝试将此元素实现(添加)到由 ASP.NET 5 创建的 DOM 中,因此我对index.cshtml_layout.cshtml这两个文件进行了更改。

文件index.cshtml是:

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

<link rel="import" href="~/helloworld.html"/> 

<div class="row">
    <hello-world></hello-world>
</div> 

_layout.cshtml我添加了两行代码:

<link rel="import" href="https://polygit.org/components/polymer/polymer.html">
<script src="https://polygit.org/components/webcomponentsjs/webcomponents-lite.js"></script>

接下来我单击调试,但屏幕上没有 Hello World。仅来自 _layout.cshtml 的页眉和页脚

4

2 回答 2

0

我认为

<link rel="import" href="~/helloworld.html"/>

必须在 { ... } 之外

如果没有,请查看源 HTML 代码,并使用 F12(IE/Chrome...调试器)查看网络选项卡以了解错误。

于 2016-10-06T10:17:31.417 回答
0

除了已经建议的内容。你确定吗

<link rel="import" href="https://polygit.org/components/polymer/polymer.html">
<script src="https://polygit.org/components/webcomponentsjs/webcomponents-lite.js"></script>

在正确的地方吗?加载页面,打开开发人员工具 (F12) 并在 HTML/DOM 视图/资源管理器中检查这些行是否实际出现在<head>加载页面的标记中。默认的 ASP.NET Core 模板包含<environment>_Layout.cshtml 中的标签。在使用您的代码进行测试时,我首先将链接放入错误的环境中。现在它对我有用。

于 2016-11-11T14:33:02.427 回答