웹 페이지 내에서 Razor와 JavaScript 코드를 원활하게 결합하는 방법은 무엇입니까?

웹 페이지에서 Razor와 JavaScript 결합

동일한 웹 페이지 내에서 Razor와 JavaScript 코드를 모두 통합하는 것은 약간 까다로울 수 있습니다. 다음 샘플 코드를 고려해 보세요.

<code class="html"><script type="text/javascript">
        var data = [];

        @foreach (var r in Model.rows)
        {
                data.push([ @r.UnixTime * 1000, @r.Value ]);
        }
</script></code>

이 코드는 data라는 JavaScript 배열을 만들고 Razor foreach 루프를 사용하여 채우려고 시도합니다. 그러나 의도한 대로 작동하지 않습니다.

이상적인 솔루션:

우리가 원하는 결과는 다음과 같은 코드를 작성할 수 있는 것입니다.

<code class="html"><script type="text/javascript">
        var data = [];

        <c#>@foreach (var r in Model.rows) {</c#>
                data.push([ <c#>@r.UnixTime</c#> * 1000, <c#>@r.Value</c#> ]);
        <c#>}</c#>
</script></code>

이 코드는 Razor와 JS 코드를 완벽하게 혼합하므로 C# 컬렉션을 쉽게 반복하고 JavaScript 배열을 채울 수 있습니다.

해결책:

이를 달성하기 위해 일반 텍스트 섹션을 사용할 수 있습니다. 및 가 포함된 태그 그리고

<code class="html"><script type="text/javascript">
        var data = [];

        @foreach (var r in Model.rows)
        {
                <text>
                        data.push([ @r.UnixTime * 1000, @r.Value ]);
                </text>
        }
</script></code>

일반 텍스트 섹션을 사용하면 스크립트 블록 내에 임의의 JS 코드를 포함하는 동시에 Razor의 구문을 활용하여 서버의 데이터에 액세스할 수 있습니다. 이제 코드는 의도한 대로 작동하여 C# 컬렉션의 값으로 데이터 배열을 채워야 합니다.

위 내용은 웹 페이지 내에서 Razor와 JavaScript 코드를 원활하게 결합하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!