将服务器端razor布尔与客户端布尔结合起来以包含一个链接

问题描述

我有一种情况，我需要决定包含一个基于客户端布尔值和服务器端布尔值的HTML链接，如下所示：

  const preloadSupported =（）=> {
 const link = document.createElement（'link'）; 
 const relList = link.relList; 
 if（！relList ||！relList.supports）
 return false; 
返回relList.supports（'preload'）; 
}; 
 
 if（[email protected]& preloadSupported（））
 {
< link rel =preloadhref =staticResource.jsas =脚本/> 
} 
  

或

<$ p （$ Model.oldLayout）//服务器端布尔
{
if（preloadSupported（））//客户端布尔
{
@foreach（Model.cssUrls中的var url）
{
< link rel =preloadhref =@ Html.StaticFile（url）as =script/>
}
}
else
{
@foreach（Model.cssUrls中的var url）
{
< link rel =prefetch href =@ Html.StaticFile（url）/>
}
}
}

我该怎么做？我尝试了不同的变化，他们都没有工作！感谢您的帮助提前

解决方案

您需要将此代码放入您的客户端的JavaScript标记中的剃须刀文件中。 / b>

从服务器传递脚本的URL，或者在JavaScript代码中硬编码。

 <脚本> 
 @if（！Model.OldLayout）
 {
< text> 
 if（preloadSupported（））
 {
 loadScript（/ scripts / script01.js）; 
 loadScript（/ scripts / script02.js）; 
 
函数loadScript（url）
 {
 var script = document.createElement（'script'）; 
 document.head.appendChild（script）; 
 script.onload = function（）
 {
 //在脚本中执行任何操作（因为它已经加载）
}; 
 script.src = url; 
} 
} 
< / text> 
} 
< / script> 
  

I have a situation where I need to decide to include a html link based on client side boolean value and server side boolean value like this :

const preloadSupported = () => {
              const link = document.createElement('link');
              const relList = link.relList;
              if (!relList || !relList.supports)
                return false;
              return relList.supports('preload');
            };

if ([email protected] && preloadSupported())
{
    <link rel="preload" href="staticResource.js" as="script" />
}

or

if (@Model.oldLayout) //server side boolean
{
    if (preloadSupported()) // client side boolean
    {
        @foreach (var url in Model.cssUrls)
        {
            <link rel="preload" href="@Html.StaticFile(url)" as="script"/>
        }
    }
    else
    {
        @foreach (var url in Model.cssUrls)
        {
            <link rel="prefetch" href="@Html.StaticFile(url)"/>
        }
    }   
}

how should I do that? I tried different variations none of them worked! thanks for your help in advance

解决方案

You need to place this code in your razor file inside your javascript tags for the client.

Pass in the urls for the scripts from the server, or hard code it in the javascript code.

<script>
    @if (!Model.OldLayout)
    {
        <text>
        if (preloadSupported())
        {
            loadScript("/scripts/script01.js");
            loadScript("/scripts/script02.js");

            function loadScript(url)
            {
                var script = document.createElement('script');
                document.head.appendChild(script);
                script.onload = function()
                {
                    // Do anything with the script here (because it's now loaded)
                };
                script.src = url;
            }
        }
        </text>
    }
</script>

这篇关于将服务器端razor布尔与客户端布尔结合起来以包含一个链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！