Przekazywanie informacji z Razor klienta (cshtml) do angularjs

Mam następujący plik brzytwa:Przekazywanie informacji z Razor klienta (cshtml) do angularjs

@{ 
    ViewBag.Title = "Blah"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
    ViewBag.InitModule = "myFooModule"; 
} 

@section Scripts{ 
    <script src="~/Scripts/angular-route.js"></script> 
    <script src="~/Scripts/angular-route.min.js"></script> 
    <script src="~/js/recipes.js"></script> 
} 
<div data-ng-view

Oto mój kod angularjs:

var testModule = angular.module("myFooModule", ['ngRoute']); 

appetizerModule.config(["$routeProvider", function ($routeProvider) { 
    $routeProvider.when("/", { 
     controller: "myController", 
     templateUrl: "/Templates/test.html" 
    }); 
    $routeProvider.otherwise({ redirectTo: "/" }); 
}]);

Chciałbym przekazać zmienną z danymi takimi jak "myuserinfofromPage" z mojej strony brzytwej do mojej angularJs, dzięki czemu mogę używać tych danych ("myuserinfofromPage") do wykonywania określonych operacji. Staram się uzyskać czysty sposób przekazywania danych, ponieważ jestem nowy w AngularJS. Jaki jest najlepszy sposób przekazywania prostych danych z Razor (cshtml) do mojego kodu Angular?

Źródło

2014-07-01 user3794178

W kanciastych zwykle otrzymujesz dane z asynchronicznego webowego połączenia API, które jest innym żądaniem niż twoja główna strona internetowa. Proponuję skonfigurować kontroler Web API. – pixelbits

Zrobiłem! Ale chciałbym przekazać parametr z mojego widoku maszynki do mojego kodu Angular. Nazywam swoje Web API w moim sterowniku kątowym i chcę ponownie użyć tego samego kodu dla różnych widoków. Przepraszam, jeśli brzmi to bardziej skomplikowanie niż to, co jest. – user3794178

w przyszłości rozważ użycie ng-init do zainicjowania zmiennych zasięgu ze znacznika –

można przekazać dane w formacie JSON do przeglądania i po bootstrap swoje dane za pomocą fabrycznego IE:

testModule.factory('UserService', function() { 

     var _userInfo= @Html.Raw(ViewBag.UserDataInJsonFormat); //<- your data is going here 

     return { 
     userInfo : _userInfo 

     }

}

Źródło

2014-07-01 14:55:40 sylwester

Dzięki pixelbits i sylwester za twoje odpowiedzi. Użyłem dyrektyw kątowych, aby przekazać dane elementów i zapisać je w zmiennej $ scope w moich kontrolerach kątowych. Odsyłacz: http://fdietz.github.io/recipes-with-angular-js/directives/passing-configuration-params-using-html-attributes.html – user3794178

@sylwester Otrzymuję 'nieoczekiwany token @ w JSON na pozycji 0 '. Czy jest coś jeszcze potrzebne? – Winnemucca

@stevek wygląda na to, że masz nieprawidłowy json – sylwester

Można umieścić następujące na stronie brzytwa:

<script> 
    app.value('myValue', @Html.Raw(Json.Encode(Model))) 
<script>

Gdzie Model jest obiektem .NET, który chcesz renderować.

Następnie wstrzyknąć go do kontrolera:

app.controller('ctrl', function($scope, myValue) 
{ 
     //use myValue 
});

Źródło

2014-07-01 20:18:51 pixelbits

To działało idealnie. Dziękuję Ci! Dokładnie to, czego potrzebowałem! –

Czy to ma znaczenie, czy jest to _Layout czy View? – Winnemucca

Thanks pixelbits Sylwester za odpowiedzi. Użyłem dyrektyw kątowych, aby przekazać dane elementów i zapisać je w zmiennej $ scope w moich kontrolerach kątowych. Odsyłacz: http://fdietz.github.io/recipes-with-angular-js/directives/passing-configuration-params-using-html-attributes.html

<body ng-app="MyApp"> 
    <div my-widget="Hello World"></div> 
</body> 
var app = angular.module("MyApp", []); 

app.directive("myWidget", function() { 
    var linkFunction = function(scope, element, attributes) { 
    scope.text = attributes["myWidget"]; 
    }; 

    return { 
    restrict: "A", 
    template: "<p></p>", 
    link: linkFunction 
    }; 
});

Źródło

2014-07-01 23:06:07 user3794178

Przekazywanie informacji z Razor klienta (cshtml) do angularjs

Odpowiedz

Powiązane problemy