Question

由于缺乏对ASP.NET的经验，我很难以一种可读取和可维护的方式很好地构造我的文件，而我最终却浪费了大量时间来查找我所要查找的特定内容想要更改我的脚本。关于如何构建ASP.NET MVC应用程序存在很多问题，其中很多与Javascript代码有关，但是它们大多是过时的，并且事情已经发生了发展。

因此，我有一个.cshtml页面，该页面需要很多前端代码（它使用Google Maps并允许您管理图钉和位置信息）。该页面当前使用的方式是该页面中使用的每个JS都仅塞入文件末尾的@section scripts中。我的组织机构最少，对我没有太大帮助。

@section scripts {
    @* Import Google Map API *@
    <script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyBfReMSOphvs4kdt81t39Pq5Y39z9MJPY0"></script>

    @* Manages the Navbar and SiteInfoNavbar *@
    <script>...</script>

    @* Manages the Map, SearchBoxes and Markers *@
    <script>...</script>

    @* Initializes the residues multiselect (in the site's info editing nav) and other html injections *@
    <script>...</script>

    @* Manages the alerts, spinners and modals *@
    <script>...</script>

    @* Manages business hours section for the selected site *@
    <script>...</script>

    @* Manages Ajax calls *@
    <script>...</script>

    @* Initialization *@
    <script>...</script>
}

我找到的解决方案之一是Garber-Irish Javascript结构格式，当JS分散在页面中时，这似乎很有用。但是，就我而言，我的问题是此页面和包含大量JS代码的文件。对于我的情况，该实现的另一个问题（也许是因为我实现了错误）是我使用当前页面@model在JS脚本中使用Controller中的某些数据：

// Parse all sites and cities from model and populate map with markers
cities = JSON.parse('@Html.Raw(Json.Serialize(Model.Cities))');
sites = JSON.parse('@Html.Raw(Json.Serialize(Model.Sites))');

因此，如果我要将Javascript代码转换到另一个文件，如何从该文件访问模型信息？

我确定我做错的另一件事是，我也在.cshtml部分中使用Json.Serialize将值作为参数传递给Javascript函数：

<button onclick='selectMarker(null,@Html.Raw(Json.Serialize(@Site)))'
        class="list-group-item list-group-item-action justify-content-between align-items-start d-flex w-100" 
        style="cursor: pointer; outline: none;">

这会使页面HTML变得非常丑陋，并且还公开了一些有关“网站”的信息，我不希望这样显示。

在ASP.NET MVC应用程序中管理和构造Javascript代码

0 个答案: