how to pass mvc controller actionresult parameters to angularjs controller

Question

In my app I'm trying to pass to mvc controller parameters to angular controller. because i want to get data from another api.

MVC Controller

public ActionResult Hotel(long hotelCode, string Destination)
{ return View(model); }

In view i pass model to script. so i can get parameters to angular.

VIEW

<script type="text/javascript">
var data = @Html.Raw(Json.Encode(Model));</script>

AngulerJS Controller

app.controller('ctrl', function ($scope, $q, $window, studentService, filterFilter) {
$scope.datax = $window.data;
$scope.saveSubs = function () {
    var sub = {
        Des: $scope.datax.HotelCode,
        DepartureDate: $scope.datax.Des
    };
    var saveSubs = APIService.hotelavailability(sub);
    saveSubs.then(function (d) {
        console.log("Succss");
            $scope.respData = d.data.hotels;
    }, function (error) {
        console.log('Oops! Something went wrong while saving the data.');
        alert("Oops! Something went wrong while saving the data.");
    });

    };
});

Is their any way to call api and bind data to view without passing parameter to angular controller?.

have you tried to use ng-init to set or intialize your data to ng controller — Jayant Patil
– Jayant Patil, Commented Apr 21, 2017 at 6:12
I think this is a wrong way to do it because of various reasons: 1) you should try to keep the front-end app as separate as possible from back-end app, this will prevent clashes between front-end and back-end teams and be more productive being managed separately based on interfaces, and by totally different stacks; 2) don't try to pass data as a global variable, is polluting global scope and has less meaning; 3) related to (1) you can use task runners or bundlers to switch between scripts which initialize data, that can create angular constants or add HTML into $templateCache; ...continue — andreim
– andreim, Commented Apr 21, 2017 at 6:23
4) if you need data from server you might as well create a $http call or use a template url that points to the right direction; 5) try to keep your HTML inside your angular templates instead of generating HTML from server-side code, then get the necessary data from server and bind it to your templates, this will allow caching your templates in $templateCache but as well you can use plugins to bundle HTML into JS code in order to cache them and prevent multiple calls; 6) don't call your controller ctrl and split your code among multiple modules, components, directives, filters, ... — andreim
– andreim, Commented Apr 21, 2017 at 6:30
actually i want to get data from hotelbeds api and bind to view. but parameters are in another view. that's the problem. — sanjeewa
– sanjeewa, Commented Apr 21, 2017 at 6:38

Garth Forster · Accepted Answer · 2017-04-21 06:19:23Z

2

Your variable data should be accessible as a global variable, without the need to inject $window.

$scope.datax = data;

If that feels uncomfortable you should be able to access the window variable directly too:

$scope.datax = window.data;

Binding directly in the template could cause problems if you ever update that value, as there's no watch set up on global variables outside the scope of your controller.

answered Apr 21, 2017 at 6:19

Garth Forster

787 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to pass mvc controller actionresult parameters to angularjs controller

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related