Wie Angular benutzerdefinierte Richtlinie TemplateUrl Pfad zu erwähnen, wenn Sie mit Asp.net MVC

Ich habe eine Beispiel-Direktive, wo ich TemplateUrl Datei Speicherort erwähnen muss. meine Template-Datei existiert in diesem Ort Views/Home/searchableMultiselect.htmlWie Angular benutzerdefinierte Richtlinie TemplateUrl Pfad zu erwähnen, wenn Sie mit Asp.net MVC

app.directive("showdata", function ($timeout) { 
    return { 
     templateUrl: '~/Views/Home/searchableMultiselect.html', 
     restrict: 'AE',

der obige Code ist in app.js Datei. Nun sagen Sie mir, wie Winkel anweisen, Template-Datei von diesem Ort '~/Views/Home/searchableMultiselect.html'

dank

Quelle

2016-05-07 Monojit Sarkar

Hier ist eine Art und Weise zu laden:

_Layout.cshtml

<body data-root='@Url.Content("~")'>

In Javascript:

function getDataRoot() { 
    var root = null; 

    if (document.body) { 
     root = document.body.getAttribute('data-root'); 
    } 

    if (!root) { 
     return '/'; 
    } 

    return root; 
} 

// This can be registed with angular, so it can be injected... 
// Right now I will use it directly 
var appUrls = { 
    templateBase = getDataRoot() + 'Views/Home/'; 
} 

.... 

app.directive("showdata", function ($timeout) { 
return { 
    templateUrl: appUrls.templateBase + 'searchableMultiselect.html', 
    restrict: 'AE',

Quelle

2016-05-07 17:16:58 VRPF

nein hat nicht funktioniert, ich habe diesen Fehler '" NetworkError: 404 nicht gefunden - http: // localhost: 2283/Views/Home/durchsuchbarMultiselect.html "' –

Sie sollen es an Ihren Fall anpassen. Es ist unwahrscheinlich, dass es aus der Box funktionieren würde. Die Idee ist dort aber ... – VRPF

Da es sich um eine asp.net Mvc app ist, Sie sollte die Hilfsmethoden wie Url.Action oder Url.Content oder Url.RouteUrl nutzen. In Ihrer Rasiereransicht können Sie eine der folgenden Methoden verwenden, um den Pfad zu Ihrem App-Basisstamm/oder einem bestimmten Root zu generieren und diesen an Ihren eckigen Controller/Angular Services/Direktiven zu übergeben.

Also in Ihrer Rasierer Ansicht/Layout-Datei, können Sie dies tun.

@section Scripts 
{ 
    <script src="~/Scripts/YourAngularControllerFileForThisPage.js"></script> 
    <script> 
     var yourApp = yourApp || {}; 
     yourApp.Settings = yourApp.Settings || {}; 
     yourApp.Settings.BaseUrl= "@Url.Content("~")"; 
     angular.module("app").value("appSettings", yourApp); 
    </script> 
}

Sie können auf dieses appSettings Objekt in Ihrem Winkel Richtlinie und verwenden Sie die Settings.BaseUrl Eigenschaft, um die vollständige URL zu Ihrer Richtlinie Vorlage zu erstellen.

(function() { 
    angular.module("app") 
     .directive("myDirective", function (appSettings) {   
      return { 
       restrict: 'E', 
       templateUrl: appSettings.Settings.BaseUrl 
             +'Scripts/MyDirectives/searchableMultiselect.html', 
       controller: function ($scope) { 
        // some code 
       } 
      } 
     }); 
})();

Dies wird die searchableMultiselect.html Datei aus ~/Scripts/MyDirectives Lage laden.

Quelle

2016-05-07 17:22:12 Shyju

kein Glück ... hat nicht funktioniert, ich habe diesen Fehler "NetworkError: 404 nicht gefunden - http: // localhost: 2283/Ansichten/Home/searchableMultiselect.html" –

Nein. [Das ist mit Absicht] (http://stackoverflow.com/a/17949486/40521). Sie dürfen nicht direkt auf Inhalte in Ihrem Views-Ordner zugreifen. Da es sich um eine eckige Direktive handelt, schlage ich vor, sie unter den Ordner Scripts zu setzen (Sie können dort ein Unterverzeichnis erstellen) – Shyju

Ich erhalte diesen Fehler ..... was ich vermisse. Ich bin neu in eckigen. Der Fehler 'Fehler: [$ injector: nomod] Modul' App 'ist nicht verfügbar! Sie haben entweder den Modulnamen falsch geschrieben oder vergessen, ihn zu laden. Wenn Sie ein Modul registrieren, stellen Sie sicher, dass Sie die Abhängigkeiten als zweites Argument angeben. http://errors.angularjs.org/1.3.14/$injector/nomod?p0=app \t return neuer ErrorConstructor (Nachricht); ' –

Wie Angular benutzerdefinierte Richtlinie TemplateUrl Pfad zu erwähnen, wenn Sie mit Asp.net MVC

Antwort

Verwandte Themen