Question

如果我使用了错误的术语，我很抱歉，我对这项技术还不熟悉。

我有一个我们称之为MainView.cshtml的视图：

<div>
  @RenderPartial("_Partial");
</div>

<script type="text/javascript">
 $(document).ready(function() {
    someFunctionDefinedIn_Partial();
 }
</script>

_Partial视图具有定义函数的javascript（在本例中为someFunctionDefinedIn_Partial。

function someFunctionDefinedIn_Partial()
{
  // This uses the "@" syntax to access C# variables, which can be done in .cshtml
  alert("Hello. This variable is from C#: @ClassInCSharp.Variable");
}

当我运行上面的代码时，我在chrome控制台中告诉我函数someFunctionDefinedIn_Partial不存在。我猜这是因为部分javascript没有走向容器。

我环顾四周，发现我可以将javascript提取到自己的.js文件并引用该文章，如SO帖子所示：How to render JavaScript into MasterLayout section from partial view?

但是，上面的帖子建议将javascript提取到自己单独的文件.js中。如果我这样做，那么我使用“原始”javascript，所以我不能使用@符号来引用我的C＃中的变量。

是否有可能以某种方式在我的MainView.cshtml中包含javascript，它也可以访问@语法，所以我可以使用C＃方法/变量？如果没有，是否可以创建一个外部javascript文件，但是它是一个.cshtml文件，所以我可以使用“@”语法？

Answer 1

我可以将Javascript（带@语法）从partial部分用到主视图吗？

是的，但javascript操作的顺序非常重要。严格来说，以下javascript代码应该出错：

console.log(myvariable);
var myvariable = "hello world!";

我在定义之前使用变量。这就是你遇到的类似问题。

我建议您直接在视图中使用Javascript吗？

绝对几乎完全从不。今天大多数javascript / css / html的写法都是紧密耦合的。向C＃添加耦合似乎是一个巨大的code smell。我个人的偏好是将数据添加到html元素，并将javascript仅与我的html耦合。所以而不是：

<script>
var myIds = [@(string.Join(Model.People.Select(p => Id.ToString().ToArray(), ",")];
</script>

这只是非常丑陋且难以调试，我将我的值应用于代表我的对象的html演示文稿：

<div data-id="@model.Id" class="person">
  Person Name: @Html.DisplayFor(m => m.name)
</div>

<script>
var myIds = [];
$('.person').each((i,p) => myIds.push($(p).data("Id"));
</script>

现在我确实错误地确保我的数组中的Id与页面上的ID相同，所有内容都封装在一起。

另一个代码气味是在逻辑视图中使用@()方法。例如，我看到了很多：

@foreach(var person in Model.persons) 
{
  if (person.Age >= 21)
  {
    <div>Adult</div>
  }
  else
  {
    <div>Child</div>
  }
}

对我而言，这是一种观点中的逻辑。我对ViewModel的定义是一个表示所有必要数据点的模型（甚至是那些从逻辑派生的数据点）。所以我会做类似的事情：

public class PersonVM
{
  public DateTime BornOn { get; set; }
  public bool IsAdult { get { return /*BornOnLogic*/; } ]
}

所以在我看来，我不明白为什么有人需要在Javascript中直接使用任何C＃。

我还建议您阅读Philip Walton's (Google Engineer) -Decoupling Your HTML, CSS, and JavaScript。

Answer 2

我建议您不要在部分视图中包含JS，因为它可以在给定视图中多次添加。看一眼 link

我建议你将部分JS移动到主视图。

<强>更新

如果您没有其他选择，请考虑Razor不能用于普通JS：Link

您可以做的是提取JS中所需的C＃值，并在调用JS时发送它们。所以你可以：

function someFunctionDefinedIn_Partial(variableValue)
{
  // This uses the "@" syntax to access C# variables, which can be done in .cshtml
  alert("Hello. This variable is from C#: " + variableValue);
}

并从局部视图中调用它：

someFunctionDefinedIn_Partial(@ClassInCSharp.Variable);

我可以使用Javascript（带@语法）从partial进入主视图吗？

2 个答案: