2011-10-02 33 views
13

Có thể truy cập thuộc tính Mô hình trong tệp Javascript bên ngoài không?Truy cập thuộc tính Mô hình trong tệp javascript?

ví dụ: Trong "somescript.js" tập tin

var currency = '@Model.Currency'; 
alert(currency); 

On Xem tôi

<script src="../../Scripts/somescript.js" type="text/javascript"> 

này không xuất hiện để làm việc, tuy nhiên nếu tôi đặt javascript trực tiếp vào xem bên trong thẻ script sau đó nó hoạt động? Điều này có nghĩa là phải luôn đặt mã trong trang thay vì tải tệp tập lệnh bên ngoài như sau:

@model MyModel; 

<script lang=, type=> 
var currency = '@Model.Currency'; 
alert(currency); 
</script> 

Có cách nào khác không?

+0

Nếu bạn có thể tạo file js bên ngoài sau đó trình duyệt của họ sẽ bộ nhớ cache dữ liệu xem mô hình tạo động của bạn. Có lẽ không phải những gì bạn muốn? – BritishDeveloper

+1

Gần đây, tôi đã viết blog về cách bạn có thể [tạo các tệp JavaScript bên ngoài bằng cách sử dụng một phần xem Razor] [blogpost]. Bài đăng trên blog cho biết cách sử dụng bộ lọc hành động tùy chỉnh để phân tích cú pháp mã Razor trong tệp JavaScript bên ngoài. ** tl; dr: ** Có, có thể sử dụng giải pháp đơn giản nhưng thông minh. [blogpost]: http://blog.mariusschulz.com/generating-external-javascript-files-using-partial-razor-views –

+0

http://stackoverflow.com/a/41312348/2592042 Tôi đã giải thích chi tiết tại đây. –

Trả lời

9

Không có cách nào để triển khai mã MVC/Razor trong tệp JS.

Bạn nên đặt dữ liệu biến trong HTML của mình (trong tệp .cshtml) và điều này là khái niệm OK và không vi phạm sự phân tách các mối quan tâm (HTML do máy chủ tạo ra so với mã script ứng dụng khách) vì nếu bạn nghĩ về nó, các giá trị biến này là mối quan tâm của máy chủ.

Hãy xem cách giải quyết (một phần nhưng đẹp) này: Using Inline C# inside Javascript File in MVC Framework

+1

Đó là một giải pháp tuyệt vời. Tôi có thể giữ tất cả các javascript "tĩnh" trong một tập tin, và sau đó đặt phần "vars" vào xem một phần và chỉ cần tải đó. Tốt đẹp :) – BlueChippy

2

gì bạn có thể làm là đi qua các thẻ dao cạo trong như là một biến.

Trong dao cạo File>

var currency = '@Model.Currency'; 
doAlert(currency); 

trong tập tin JS>

function doAlert(curr){ 
    alert(curr); 
} 
0

Bạn luôn có thể thử RazorJs. Đó là khá nhiều phá được không thể sử dụng một mô hình trong file js của bạn RazorJs

1

Hãy thử JavaScriptModel (http://jsm.codeplex.com):

Chỉ cần thêm đoạn mã sau vào hành động điều khiển của bạn:

this.AddJavaScriptVariable("Currency", Currency); 

Bây giờ bạn có thể truy cập biến "Tiền tệ" trong JavaScript.

Nếu biến này có sẵn trên trang web lỗ, hãy đặt nó vào bộ lọc. Một ví dụ về cách sử dụng JavaScriptModel từ một bộ lọc có thể được tìm thấy trong tài liệu.

9

Tôi giải quyết vấn đề này bằng cách sử dụng thuộc tính dữ liệu, cùng với jQuery. Nó làm cho mã rất dễ đọc, và không cần quan sát một phần hoặc chạy javascript tĩnh thông qua ViewEngine. Tệp JavaScript hoàn toàn tĩnh và sẽ được lưu vào bộ nhớ cache bình thường.

Index.cshtml:

@model Namespace.ViewModels.HomeIndexViewModel 
<h2> 
    Index 
</h2> 

@section scripts 
{ 
    <script id="Index.js" src="~/Path/To/Index.js" 
     data-action-url="@Url.Action("GridData")" 
     data-relative-url="@Url.Content("~/Content/Images/background.png")" 
     data-sort-by="@Model.SortBy 
     data-sort-order="@Model.SortOrder 
     data-page="@ViewData["Page"]" 
     data-rows="@ViewData["Rows"]"></script> 
} 

Index.js:

jQuery(document).ready(function ($) { 
    // import all the variables from the model 
    var $vars = $('#Index\\.js').data(); 

    alert($vars.page); 
    alert($vars.actionUrl); // Note: hyphenated names become camelCased 
}); 

_Layout.cshtml (không bắt buộc, nhưng thói quen tốt):

<body> 
    <!-- html content here. scripts go to bottom of body --> 

    @Scripts.Render("~/bundles/js") 
    @RenderSection("scripts", required: false) 
</body> 
Các vấn đề liên quan