如何將模型數據從局部視圖傳遞到JavaScript？

Question

我有一個強類型A模型局部視圖。

是否可以將模型數據傳遞給外部JavaScript？

我的局部視圖臨時是這樣的：

@model MyProject.Models.myModel
<script src=".../myScript.js"><script>
<span>
      @Html.DisplayFor(model => model)
      //how do I pass data to myScript.js?
</span>

在外部JavaScript（myScript.js）中：

$(document).ready(function () {
    //how do I get data from the partial view?
})

Answer 1

首先，不建議在局部視圖中使用腳本，因此我將使用非局部視圖來說明我的答案。

您的要求是不可能的，但是您肯定會在Partial View的Parent視圖中看到以下內容：

@model MyProject.Models.ParentModel
...
<script src=".../myScript.js"><script>
...
<span>
      ...
      @Html.DisplayFor(model => model)
      ...
</span>
...
<script>
        $(document).ready(function(){
           var jsVariable = '@Model.MyModelVariable'
        })
<script>  
...

通過這種方式，您將在腳本中獲得強類型模型的好處，盡管請注意，這違反了不引人注目的js原則……但是，合理使用是無害的。

我發現使用如下所示的Module模式的好習慣：

<script>
   $(document).ready(function(){
       var mod = new MyModule({
             foo : '@Model.Foo',
             bazSelector: '@Html.NameFor(model => model.Baz).ToString()'
             // ... other module options
       })
   });
<script>

然后，在您的外部文件中，您可以擁有您的模塊：

function MyModule(options){
  // use the options created from a strongly typed model... 
}