Aggiungi file CSS o JavaScript all'intestazione del layout da viste o viste parziali


176

Intestazione pagine layout:

<head>
    <link href="@Url.Content("~/Content/themes/base/Site.css")"
          rel="stylesheet" type="text/css" />
</head>

Una vista (AnotherView) dall'applicazione richiede:

<link href="@Url.Content("~/Content/themes/base/AnotherPage.css")"
      rel="stylesheet" type="text/css" />

e AnotherView ha una vista parziale (AnotherPartial) che richiede:

<link href="@Url.Content("~/Content/themes/base/AnotherPartial.css")"
      rel="stylesheet" type="text/css" />

Domanda: Come possiamo aggiungere questi collegamenti ai file CSS AnotherView e AnotherPartial link all'intestazione Layout ?

RenderSection non è una buona idea perché AnotherPage può avere più di un parziale. Aggiungere tutti i CSS alla testa non è utile perché cambierà dinamicamente (dipende da Anotherpages).


@NuriYILMAZ è un'enorme differenza tra "dalle viste" e "o viste parziali" come dice il tuo titolo. Comunque, qualche nuova idea in merito?
Shimmy Weitzhandler,

Risposte:


196

Disposizione:

<html>
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
        <script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/modernizr-2.0.6-development-only.js")" type="text/javascript"></script>
        @if (IsSectionDefined("AddToHead"))
        {
            @RenderSection("AddToHead", required: false)
        }

        @RenderSection("AddToHeadAnotherWay", required: false)
    </head>

Visualizza:

@model ProjectsExt.Models.DirectoryObject

@section AddToHead{
    <link href="@Url.Content("~/Content/Upload.css")" rel="stylesheet" type="text/css" />
}

5
Penso che questa sia la soluzione più semplice.
iamichi,

Bella soluzione pronta all'uso!
jerrylroberts,

14
Ciò non funzionerà se la AddToHeadsezione è in una vista parziale incorporata in View.
Shimmy Weitzhandler,

57
La domanda menzionata in modo specifico vista parziale e questa risposta con il punteggio più alto non risolve il problema! Questa potrebbe essere un'ottima soluzione per un'altra query, ma non questa.
corvo vulcanico

1
Sarebbe stata una soluzione elegante se avesse funzionato in modo acuto con viste parziali.
Jonny il

75

Aggiornamento : esempio di base disponibile su https://github.com/speier/mvcassetshelper

Stiamo usando la seguente implementazione per aggiungere file JS e CSS nella pagina di layout.

Visualizza o PartialView:

@{
    Html.Assets().Styles.Add("/Dashboard/Content/Dashboard.css");
    Html.Assets().Scripts.Add("/Dashboard/Scripts/Dashboard.js");
}

Pagina layout:

<head>
    @Html.Assets().Styles.Render()
</head>

<body>
    ...
    @Html.Assets().Scripts.Render()
</body>

Estensione HtmlHelper:

public static class HtmlHelperExtensions
{
    public static AssetsHelper Assets(this HtmlHelper htmlHelper)
    {
        return AssetsHelper.GetInstance(htmlHelper);
    }    
}

public class AssetsHelper 
{
    public static AssetsHelper GetInstance(HtmlHelper htmlHelper)
    {
        var instanceKey = "AssetsHelperInstance";

        var context = htmlHelper.ViewContext.HttpContext;
        if (context == null) return null;

        var assetsHelper = (AssetsHelper)context.Items[instanceKey];

        if (assetsHelper == null)
            context.Items.Add(instanceKey, assetsHelper = new AssetsHelper());

        return assetsHelper;
    }

    public ItemRegistrar Styles { get; private set; }
    public ItemRegistrar Scripts { get; private set; }

    public AssetsHelper()
    {
        Styles = new ItemRegistrar(ItemRegistrarFormatters.StyleFormat);
        Scripts = new ItemRegistrar(ItemRegistrarFormatters.ScriptFormat);
    }
}

public class ItemRegistrar
{
    private readonly string _format;
    private readonly IList<string> _items;

    public ItemRegistrar(string format)
    {
        _format = format;
        _items = new List<string>();
    }

    public ItemRegistrar Add(string url)
    {
        if (!_items.Contains(url))
            _items.Add(url);

        return this;
    }

    public IHtmlString Render()
    {
        var sb = new StringBuilder();

        foreach (var item in _items)
        {
            var fmt = string.Format(_format, item);
            sb.AppendLine(fmt);
        }

        return new HtmlString(sb.ToString());
    }
}

public class ItemRegistrarFormatters
{
    public const string StyleFormat = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />";
    public const string ScriptFormat = "<script src=\"{0}\" type=\"text/javascript\"></script>";
}

2
@JBeckton: dai un'occhiata al codice e sostituisci i Insertmetodi con i Addmetodi
Valamas,

9
@Kalman - il filo-sicurezza di questo ha (giustamente, a mio avviso) stata messa in discussione: stackoverflow.com/questions/6609586/...
Marc Gravell

2
Questo è molto sbagliato; dovrebbe essere [ThreadStatic], o preferibilmente, immagazzinato in HttpContext.Items.
SLaks,

6
Mi sto perdendo qualcosa? Se Styles.Render () viene chiamato in <head>, tutti i file CSS aggiunti dopo <head> (ovvero i file aggiunti in viste parziali) non verranno renderizzati. (MVC esegue il rendering dall'alto verso il basso.)
Ken,

3
@FernandoCorreia Penso che tu abbia sbagliato tutto. Le sezioni nominate non funzionano nelle viste parziali che sono la base di questo intero thread.
Shimmy Weitzhandler,

11

Purtroppo, questo non è possibile per impostazione predefinita da utilizzare sectioncome suggerito da un altro utente, poiché a sectionè disponibile solo all'immediato childdi a View.

Ciò che funziona tuttavia è l' implementazione e la ridefinizione di sectionin ogni vista , ovvero:

section Head
{
    @RenderSection("Head", false)
}

In questo modo ogni vista può implementare una sezione principale, non solo i bambini immediati. Questo funziona solo in parte però, specialmente con più parziali i problemi iniziano (come hai detto nella tua domanda).

Quindi l'unica vera soluzione al tuo problema è usare il ViewBag . Il migliore sarebbe probabilmente una raccolta separata (elenco) per CSS e script. Affinché ciò funzioni, è necessario assicurarsi che l'in Listuso venga inizializzato prima di eseguire una delle viste. Quindi puoi fare cose come questa nella parte superiore di ogni vista / parziale (senza preoccuparti se il valore Scriptso Stylesè null:

ViewBag.Scripts.Add("myscript.js");
ViewBag.Styles.Add("mystyle.css");

Nel layout è quindi possibile scorrere le raccolte e aggiungere gli stili in base ai valori in List.

@foreach (var script in ViewBag.Scripts)
{
    <script type="text/javascript" src="@script"></script>
}
@foreach (var style in ViewBag.Styles)
{
    <link href="@style" rel="stylesheet" type="text/css" />
}

Penso che sia brutto, ma è l'unica cosa che funziona.

****** AGGIORNAMENTO **** Dal momento che inizia a eseguire prima le viste interne e ad uscire dal layout e gli stili CSS sono in cascata, probabilmente avrebbe senso invertire l'elenco di stili tramite ViewBag.Styles.Reverse() .

In questo modo viene aggiunto per primo lo stile più esterno, in linea con il modo in cui funzionano i fogli di stile CSS.


1
Grazie ntziolis. Sembra bello ma le testine del layout del rasoio funzionano prima di un'altra vista e la dinamica .scripts e .styles era vuota prima di un'altra vista. Ho trovato un bel blog a riguardo e ho condiviso questa domanda.
Nuri YILMAZ,

Questo funzionerà per qualsiasi vista derivata ma non per i parziali. Per i parziali, infatti, l'ordine di esecuzione è sbagliato. fondamentalmente per i parziali non c'è modo di includerli nell'intestazione. Suggerirei, invece di aggiungerlo all'intestazione, aggiungilo all'inizio del tag body. Non sarebbe la mia prima scelta, ma in questo modo hai un modo conciso di gestire tutti gli stili / j in un posto, piuttosto che spargerli.
ntziolis,

Sono d'accordo con te. Perché ho trovato alcune soluzioni come ho elencato sulla risposta, ma è esattamente js solutions. Mi chiedo davvero perché non abbiamo potuto usare la pagina di layout come asp.net classico. Significa che posso raggiungere la testa dalla pagina figlio.
Nuri YILMAZ,

11

È possibile definire la sezione tramite RenderSection metodo nel layout.

disposizione

<head>
  <link href="@Url.Content("~/Content/themes/base/Site.css")"
    rel="stylesheet" type="text/css" />
  @RenderSection("heads", required: false)
</head>

Quindi puoi includere i tuoi file css nell'area della sezione nella tua vista tranne la vista parziale .

La sezione funziona in vista, ma non funziona in vista parziale in base alla progettazione .

<!--your code -->
@section heads
{
  <link href="@Url.Content("~/Content/themes/base/AnotherPage.css")"
  rel="stylesheet" type="text/css" />
}

Se vuoi davvero usare l'area della sezione in vista parziale, puoi seguire l'articolo per ridefinire il metodo RenderSection.

Rasoio, layout nidificati e sezioni predefinite - Marcin su ASP.NET


6

Ho avuto un problema simile e ho finito per applicare l'eccellente risposta di Kalman con il codice seguente (non abbastanza pulito, ma probabilmente più espandibile):

namespace MvcHtmlHelpers
{
    //http://stackoverflow.com/questions/5110028/add-css-or-js-files-to-layout-head-from-views-or-partial-views#5148224
    public static partial class HtmlExtensions
    {
        public static AssetsHelper Assets(this HtmlHelper htmlHelper)
        {
            return AssetsHelper.GetInstance(htmlHelper);
        }
    }
    public enum BrowserType { Ie6=1,Ie7=2,Ie8=4,IeLegacy=7,W3cCompliant=8,All=15}
    public class AssetsHelper
    {
        public static AssetsHelper GetInstance(HtmlHelper htmlHelper)
        {
            var instanceKey = "AssetsHelperInstance";
            var context = htmlHelper.ViewContext.HttpContext;
            if (context == null) {return null;}
            var assetsHelper = (AssetsHelper)context.Items[instanceKey];
            if (assetsHelper == null){context.Items.Add(instanceKey, assetsHelper = new AssetsHelper(htmlHelper));}
            return assetsHelper;
        }
        private readonly List<string> _styleRefs = new List<string>();
        public AssetsHelper AddStyle(string stylesheet)
        {
            _styleRefs.Add(stylesheet);
            return this;
        }
        private readonly List<string> _scriptRefs = new List<string>();
        public AssetsHelper AddScript(string scriptfile)
        {
            _scriptRefs.Add(scriptfile);
            return this;
        }
        public IHtmlString RenderStyles()
        {
            ItemRegistrar styles = new ItemRegistrar(ItemRegistrarFormatters.StyleFormat,_urlHelper);
            styles.Add(Libraries.UsedStyles());
            styles.Add(_styleRefs);
            return styles.Render();
        }
        public IHtmlString RenderScripts()
        {
            ItemRegistrar scripts = new ItemRegistrar(ItemRegistrarFormatters.ScriptFormat, _urlHelper);
            scripts.Add(Libraries.UsedScripts());
            scripts.Add(_scriptRefs);
            return scripts.Render();
        }
        public LibraryRegistrar Libraries { get; private set; }
        private UrlHelper _urlHelper;
        public AssetsHelper(HtmlHelper htmlHelper)
        {
            _urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);
            Libraries = new LibraryRegistrar();
        }
    }
    public class LibraryRegistrar
    {
        public class Component
        {
            internal class HtmlReference
            {
                internal string Url { get; set; }
                internal BrowserType ServeTo { get; set; }
            }
            internal List<HtmlReference> Styles { get; private set; }
            internal List<HtmlReference> Scripts { get; private set; }
            internal List<string> RequiredLibraries { get; private set; }

            public Component()
            {
                Styles = new List<HtmlReference>();
                Scripts = new List<HtmlReference>();
                RequiredLibraries = new List<string>();
            }
            public Component Requires(params string[] libraryNames)
            {
                foreach (var lib in libraryNames)
                {
                    if (!RequiredLibraries.Contains(lib))
                        { RequiredLibraries.Add(lib); }
                }
                return this;
            }
            public Component AddStyle(string url, BrowserType serveTo = BrowserType.All)
            {
                Styles.Add(new HtmlReference { Url = url, ServeTo=serveTo });
                return this;
            }
            public Component AddScript(string url, BrowserType serveTo = BrowserType.All)
            {
                Scripts.Add(new HtmlReference { Url = url, ServeTo = serveTo });
                return this;
            }
        }
        private readonly Dictionary<string, Component> _allLibraries = new Dictionary<string, Component>();
        private List<string> _usedLibraries = new List<string>();
        internal IEnumerable<string> UsedScripts()
        {
            SetOrder();
            var returnVal = new List<string>();
            foreach (var key in _usedLibraries)
            {
                returnVal.AddRange(from s in _allLibraries[key].Scripts
                                   where IncludesCurrentBrowser(s.ServeTo)
                                   select s.Url);
            }
            return returnVal;
        }
        internal IEnumerable<string> UsedStyles()
        {
            SetOrder();
            var returnVal = new List<string>();
            foreach (var key in _usedLibraries)
            {
                returnVal.AddRange(from s in _allLibraries[key].Styles
                                   where IncludesCurrentBrowser(s.ServeTo)
                                   select s.Url);
            }
            return returnVal;
        }
        public void Uses(params string[] libraryNames)
        {
            foreach (var name in libraryNames)
            {
                if (!_usedLibraries.Contains(name)){_usedLibraries.Add(name);}
            }
        }
        public bool IsUsing(string libraryName)
        {
            SetOrder();
            return _usedLibraries.Contains(libraryName);
        }
        private List<string> WalkLibraryTree(List<string> libraryNames)
        {
            var returnList = new List<string>(libraryNames);
            int counter = 0;
            foreach (string libraryName in libraryNames)
            {
                WalkLibraryTree(libraryName, ref returnList, ref counter);
            }
            return returnList;
        }
        private void WalkLibraryTree(string libraryName, ref List<string> libBuild, ref int counter)
        {
            if (counter++ > 1000) { throw new System.Exception("Dependancy library appears to be in infinate loop - please check for circular reference"); }
            Component library;
            if (!_allLibraries.TryGetValue(libraryName, out library))
                { throw new KeyNotFoundException("Cannot find a definition for the required style/script library named: " + libraryName); }
            foreach (var childLibraryName in library.RequiredLibraries)
            {
                int childIndex = libBuild.IndexOf(childLibraryName);
                if (childIndex!=-1)
                {
                    //child already exists, so move parent to position before child if it isn't before already
                    int parentIndex = libBuild.LastIndexOf(libraryName);
                    if (parentIndex>childIndex)
                    {
                        libBuild.RemoveAt(parentIndex);
                        libBuild.Insert(childIndex, libraryName);
                    }
                }
                else
                {
                    libBuild.Add(childLibraryName);
                    WalkLibraryTree(childLibraryName, ref libBuild, ref counter);
                }
            }
            return;
        }
        private bool _dependenciesExpanded;
        private void SetOrder()
        {
            if (_dependenciesExpanded){return;}
            _usedLibraries = WalkLibraryTree(_usedLibraries);
            _usedLibraries.Reverse();
            _dependenciesExpanded = true;
        }
        public Component this[string index]
        {
            get
            {
                if (_allLibraries.ContainsKey(index))
                    { return _allLibraries[index]; }
                var newComponent = new Component();
                _allLibraries.Add(index, newComponent);
                return newComponent;
            }
        }
        private BrowserType _requestingBrowser;
        private BrowserType RequestingBrowser
        {
            get
            {
                if (_requestingBrowser == 0)
                {
                    var browser = HttpContext.Current.Request.Browser.Type;
                    if (browser.Length > 2 && browser.Substring(0, 2) == "IE")
                    {
                        switch (browser[2])
                        {
                            case '6':
                                _requestingBrowser = BrowserType.Ie6;
                                break;
                            case '7':
                                _requestingBrowser = BrowserType.Ie7;
                                break;
                            case '8':
                                _requestingBrowser = BrowserType.Ie8;
                                break;
                            default:
                                _requestingBrowser = BrowserType.W3cCompliant;
                                break;
                        }
                    }
                    else
                    {
                        _requestingBrowser = BrowserType.W3cCompliant;
                    }
                }
                return _requestingBrowser;
            }
        }
        private bool IncludesCurrentBrowser(BrowserType browserType)
        {
            if (browserType == BrowserType.All) { return true; }
            return (browserType & RequestingBrowser) != 0;
        }
    }
    public class ItemRegistrar
    {
        private readonly string _format;
        private readonly List<string> _items;
        private readonly UrlHelper _urlHelper;

        public ItemRegistrar(string format, UrlHelper urlHelper)
        {
            _format = format;
            _items = new List<string>();
            _urlHelper = urlHelper;
        }
        internal void Add(IEnumerable<string> urls)
        {
            foreach (string url in urls)
            {
                Add(url);
            }
        }
        public ItemRegistrar Add(string url)
        {
            url = _urlHelper.Content(url);
            if (!_items.Contains(url))
                { _items.Add( url); }
            return this;
        }
        public IHtmlString Render()
        {
            var sb = new StringBuilder();
            foreach (var item in _items)
            {
                var fmt = string.Format(_format, item);
                sb.AppendLine(fmt);
            }
            return new HtmlString(sb.ToString());
        }
    }
    public class ItemRegistrarFormatters
    {
        public const string StyleFormat = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />";
        public const string ScriptFormat = "<script src=\"{0}\" type=\"text/javascript\"></script>";
    }
}

Il progetto contiene un metodo statico AssignAllResources:

assets.Libraries["jQuery"]
        .AddScript("~/Scripts/jquery-1.10.0.min.js", BrowserType.IeLegacy)
        .AddScript("~/Scripts//jquery-2.0.1.min.js",BrowserType.W3cCompliant);
        /* NOT HOSTED YET - CHECK SOON 
        .AddScript("//ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js",BrowserType.W3cCompliant);
        */
    assets.Libraries["jQueryUI"].Requires("jQuery")
        .AddScript("//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js",BrowserType.Ie6)
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/eggplant/jquery-ui.css",BrowserType.Ie6)
        .AddScript("//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js", ~BrowserType.Ie6)
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/themes/eggplant/jquery-ui.css", ~BrowserType.Ie6);
    assets.Libraries["TimePicker"].Requires("jQueryUI")
        .AddScript("~/Scripts/jquery-ui-sliderAccess.min.js")
        .AddScript("~/Scripts/jquery-ui-timepicker-addon-1.3.min.js")
        .AddStyle("~/Content/jQueryUI/jquery-ui-timepicker-addon.css");
    assets.Libraries["Validation"].Requires("jQuery")
        .AddScript("//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js")
        .AddScript("~/Scripts/jquery.validate.unobtrusive.min.js")
        .AddScript("~/Scripts/mvcfoolproof.unobtrusive.min.js")
        .AddScript("~/Scripts/CustomClientValidation-1.0.0.min.js");
    assets.Libraries["MyUtilityScripts"].Requires("jQuery")
        .AddScript("~/Scripts/GeneralOnLoad-1.0.0.min.js");
    assets.Libraries["FormTools"].Requires("Validation", "MyUtilityScripts");
    assets.Libraries["AjaxFormTools"].Requires("FormTools", "jQueryUI")
        .AddScript("~/Scripts/jquery.unobtrusive-ajax.min.js");
    assets.Libraries["DataTables"].Requires("MyUtilityScripts")
        .AddScript("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js")
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css")
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables_themeroller.css");
    assets.Libraries["MvcDataTables"].Requires("DataTables", "jQueryUI")
        .AddScript("~/Scripts/jquery.dataTables.columnFilter.min.js");
    assets.Libraries["DummyData"].Requires("MyUtilityScripts")
        .AddScript("~/Scripts/DummyData.js")
        .AddStyle("~/Content/DummyData.css");     

nella pagina _layout

@{
    var assets = Html.Assets();
    CurrentResources.AssignAllResources(assets);
    Html.Assets().RenderStyles()
}
</head>
...
    @Html.Assets().RenderScripts()
</body>

e nelle parti parziali e nelle viste

Html.Assets().Libraries.Uses("DataTables");
Html.Assets().AddScript("~/Scripts/emailGridUtilities.js");

Interessante. Sembra eccessivo, ma vedo che questo viene usato di più con i siti Web che non hanno altra scelta, ma per gestire gli utenti che utilizzano versioni precedenti di ie ... come in ambienti aziendali in cui alcuni paesi non si sono aggiornati e vuoi spararti. lol. +1 per quello
pqsk il

5

Ho provato a risolvere questo problema.

La mia risposta è qui

"DynamicHeader" - http://dynamicheader.codeplex.com/ , https://nuget.org/packages/DynamicHeader

Ad esempio, _Layout.cshtml è:

<head>
@Html.DynamicHeader()
</head>
...

Inoltre, puoi registrare i file .js e .css su "DynamicHeader" ovunque vuoi.

Ad esempio, il blocco di codice in AnotherPartial.cshtm è:

@{
  DynamicHeader.AddSyleSheet("~/Content/themes/base/AnotherPartial.css");
  DynamicHeader.AddScript("~/some/myscript.js");
}

Quindi, l'output HTML finale è:

<html>
  <link href="/myapp/Content/themes/base/AnotherPartial.css" .../>
  <script src="/myapp/some/myscript.js" ...></script>
</html>
...

4

Prova la soluzione pronta all'uso (ASP.NET MVC 4 o successive):

@{
    var bundle = BundleTable.Bundles.GetRegisteredBundles().First(b => b.Path == "~/js");

    bundle.Include("~/Scripts/myFile.js");
}

Ricevo un errore:CS0103: The name 'BundleTable' does not exist in the current context
Kunal,

nvm: risolto. Ho dovuto aggiungere System.Web.OptimizationcioèSystem.Web.Optimization.BundleTable.Bundles.GetRegisteredBundles().First(b => b.Path == "~/bundles/css");
Kunal

1
Questo non modifica il bundle a livello globale? Se lo fai a pagina A e successivamente apri la pagina B, la pagina B includerà anche myFile.js che non credo fosse voluto dall'OP
miglia82

4

Per quelli di noi che usano ASP.NET MVC 4 - questo può essere utile.

Innanzitutto, ho aggiunto una classe BundleConfig nella cartella App_Start.

Ecco il mio codice che ho usato per crearlo:

using System.Web.Optimization;

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/SiteMaster.css"));
    }
}

In secondo luogo, ho registrato la classe BundleConfig nel file Global.asax:

protected void Application_Start()
{
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

In terzo luogo, ho aggiunto gli helper di stile al mio file CSS:

/* Styles for validation helpers */
.field-validation-error {
    color: red;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

Alla fine ho usato questa sintassi in qualsiasi vista:

@Styles.Render("~/Content/css")

3

Ecco un plugin NuGet chiamato Cassette , che tra le altre cose ti dà la possibilità di fare riferimento a script e stili nei parziali.

Sebbene ci siano una serie di configurazioni disponibili per questo plugin, il che lo rende altamente flessibile. Ecco il modo più semplice di fare riferimento a file di script o fogli di stile:

Bundles.Reference("scripts/app");

Secondo la documentazione :

Chiamate a Reference possono apparire ovunque in una pagina, layout o vista parziale.

L'argomento path può essere uno dei seguenti:

  • Un percorso bundle
  • Un percorso di asset: viene fatto riferimento all'intero bundle contenente questo asset
  • Un URL

2

Ho scritto un semplice wrapper che ti consente di registrare dinamicamente stili e script in ogni vista parziale nel tag head.

Si basa sul jsakamoto di DynamicHeader, ma presenta alcuni miglioramenti e modifiche alle prestazioni.

È molto facile da usare e versatile.

L'utilizzo:

@{
    DynamicHeader.AddStyleSheet("/Content/Css/footer.css", ResourceType.Layout);    
    DynamicHeader.AddStyleSheet("/Content/Css/controls.css", ResourceType.Infrastructure);
    DynamicHeader.AddScript("/Content/Js/Controls.js", ResourceType.Infrastructure);
    DynamicHeader.AddStyleSheet("/Content/Css/homepage.css");    
}

Puoi trovare il codice completo, le spiegazioni e gli esempi all'interno: Aggiungi stili e script dinamicamente al tag head

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.