在ASP.NET Core PartialView

时间:2017-01-10 17:52:40

标签: javascript jquery asp.net-core asp.net-core-mvc asp.net-core-1.0

在ASP.NET Core应用程序中,我有一个带小部件的仪表板。每个小部件都有自己的PartialViews,因此整个页面按以下方式生成:

-Layout.cshtml

- Dashboard.cshtml

--- Widget1.cshtml

--- Widget2.cshtml

根据快速页面加载时间遵循最佳做法,JavaScript将在Layout.cshtml中的结束</body>标记之前加载。之后,有一个自定义JS的部分,我通常用它来启动页面加载对象。所以这部分看起来像这样:

<script asp-append-version="true" type="text/javascript" src="~/clientscript/page.min.js"></script>
@RenderSection("Js", required: false)

在我的视图中,它使用Layout.cshtml作为布局(在此示例中为Dashboard.cshtml),我可以定义一个类似

的部分
@section Js {
    // Js Code here
}

在包含所有脚本文件的脚本标记之后呈现。所以我可以肯定,所有依赖项如jQuery或自定义类都可以在这里使用。

但是我还需要在像Widget1.cshtml这样的小部件中这样做。问题是:我在Dashboard.cshtml中加载了PartialView Widget1.cshtml。在documentation is written中,这是不可能的:

  

如果在局部视图中声明Razor部分,则其父部分将无法看到它;它仅限于局部视图。

但这正是我所需要的。有办法解决这个限制吗?不久,我们的目标是将PartialView中的JavaScript注入LayoutView,并在它们之间使用常规视图。

我知道的唯一方法是使用setInterval(),间隔较小,如50ms,并检查jQuery或我的一些自定义类是否在循环中定义,直到它们为止。它的JS解决方案是的。但是它可以直接在PartialView中包含脚本块而无需使用部分。当你依赖像jQuery这样的单个变量时,它非常适合。

但我需要等待自定义类加载。它们包含在jQuery之后。因此,编写像waitForTypeLoaded(type, callback)这样的通用函数是不可能的。这会让我总是写出原始的setInterval()代码,这对我来说似乎不是一个聪明的解决方案。

3 个答案:

答案 0 :(得分:3)

我在Jquery完成加载后让我的脚本运行的东西是在我的部分视图和视图组件中我使用了&#34; DOMContentLoaded&#34;在页面加载完成后加载所有jQuery js脚本的事件。这样我就可以在我的页面上推迟jQuery和Still Have jQuery代码的加载。

<script>
    window.addEventListener('DOMContentLoaded',
        function() {
            $('body')....

        });
</script>

答案 1 :(得分:0)

您的问题可以在我对这篇文章的回答中提到: How to render scripts, generated in TagHelper process method, to the bottom of the page rather than next to the tag element?

总而言之,您可以创建一对标记助手,一个可以位于局部视图中,只将其内容存储在临时字典中,另一个将内容呈现在适当的位置(例如,布局页面)。我广泛使用它来渲染小型动态创建的脚本作为正文的最终脚本。

希望它有所帮助。

答案 2 :(得分:-1)

老实说,如果你有这样的困境,我会退后一步再看看建筑。

为什么不添加所需的脚本,这些脚本将用于主要布局的几个视图/部分视图?在ASP.NET MVC中,您可以使用捆绑机制(或者您可以编写我们自己的) - 缩小并将它们与其他所需的捆绑在一起。它不会很重......

你的方法看似不必要的复杂。