AngularJs-将值分配给范围内联变量

时间:2018-07-30 17:55:12

标签: c# angularjs asp.net-mvc

这是一个非常简单的问题,我在C#MVC中使用AngularJS v1.7.2。

我使用布局页面和视图进行了标准设置。 我从外部脚本文件加载了AngularJs控制器/服务,因此视图上没有任何内容。

我的问题是我想将ViewBag中的一个值分配给一个控制器变量,但是我显然无法在脚本中引用ViewBag,因为它需要在cshtml页面上完成。

我已经尝试过在ng-init中这样做

<div ng-init="City = @ViewBag.City"></div>

<div style="visibility: hidden;">{{CityId = '1'}}</div>

我尝试了{{City = @ViewBag.City}}'@ViewBag.City'的变体以及在StackOverflow上看到的其他两个变体,但均无济于事。

我使用以下命令在视图上加载脚本:

@section Page_Scripts {
    @Scripts.Render("~/angular/ngListing")
}

那显然是在Layout中加载的。我的控制器工作正常,所以这不是问题。

我的控制器正在初始化时进行ajax调用,这时我需要用正确的值填充$scope.City,但始终将其设置为0。

这是我的控制器+服务(为了SO而组合)的样子:

_mainApp.controller("ListingCtrl", function ($scope, $http) {
    $scope.City = 0;
    $scope.Attractions = [];
    $scope.Offset = 0;
    $scope.Pages = new Array(10);

    var MakeRequest = function (offset) {
        $http.post("/City/GetStuff?City=" + $scope.City + "&Offset=" + offset).then(function (resp) {
            $scope.Attractions = resp.data;
        });
    }

    MakeRequest($scope.Offset);

    $scope.PageUp = function () {
        $scope.Offset++;
        MakeRequest($scope.Offset);
    }

    $scope.PageDown = function () {
        $scope.Offset--;
        MakeRequest($scope.Offset);
    }

    $scope.GoTo = function (offset) {
        $scope.Offset = offset;
        MakeRequest(offset);
    }

});

任何非骇客的解决方案将不胜感激。它可以包括指令或将值分配给$ scope.City但可以内联的方法,或者至少可以将我的ViewBag.City值以某种方式传递给控制器​​。

1 个答案:

答案 0 :(得分:1)

ng-init指令中使用一个函数:

<div ng-init="initCity(@ViewBag.City)"></div>

在控制器中定义功能:

$scope.initCity = function(city) {
    $scope.city = city;
    MakeRequest($scope.offset, $scope.city);
};

function MakeRequest(offset,city) {
    var url = "/City/GetStuff";
    var params = {city:city, offset:offset};
    var config = {params: params};
    $http.get(url,config).then(function (resp) {
        $scope.Attractions = resp.data;
    });
}

这样,控制器将等待ng-init指令。