将 JSON 从 C# 解析为 AngularJS

Question

我有一个文件名数组：

[HttpPost]

    public JsonResult GetJSONFilesList()

    {

        string[] filesArray = Directory.GetFiles("/UploadedFiles/");

        for (int i = 0; i < filesArray.Length; i++)

        {

            filesArray[i] = Path.GetFileName(filesArray[i]);

        }

        return Json(filesArray);

    }

我需要在 AngularJS 中将此作为对象列表，以便我可以重复它并应用过滤器。我无法弄清楚如何将 JSON 从 MVC 控制器获取到 AngularJS。

我已经尝试了以下方法使其对视图可见以获取角度，但我不知道如何让 ng-init 看到返回列表的函数。它在“SerializeObject(GetJSONFilesList())”上出错，说它在当前上下文中不存在。

<div ng-controller="MyController" data-ng-init="init(@Newtonsoft.Json.JsonConvert.SerializeObject(GetJSONFilesList()),

         @Newtonsoft.Json.JsonConvert.SerializeObject(Model.Done))" ng-cloak>

        </div>

编辑： 我试过使用 http.get。

测试一：

alert('page load'); 

$scope.hello = 'hello';   

$http.get('http://rest-service.guides.spring.io/greeting').

        then(function (response) {

            $scope.greeting = response.data;

            alert($scope.greeting);

        });

 alert($scope.hello);

http.get 中的警报永远不会触发，但是其他警报会触发。

测试二：

$http({

        url: '/Home/testHello',

        method: 'GET'

    }).success(function (data, status, headers, config) {

        $scope.hello = data;

        alert('hi');

        });

[HttpPost]

        public string testHello()

        {

            return "hello world"; 

        }

这会导致 angular 中断并且 .js 中的任何内容都不起作用。

Answer 1

其他答案说在角度函数中使用 .success，不推荐使用 .success 和 .error ，而应该使用 .then 。工作结果：MVC：public JsonResult GetFileList()&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; //form array here&nbsp; &nbsp; &nbsp; &nbsp; return Json(myArray, JsonRequestBehavior.AllowGet);&nbsp; &nbsp; }该函数需要是 JsonResult 类型，并且使用 JsonRequestBehavior.AllowGet 返回 Json 的值。AngularJS：$scope.fileList;&nbsp; &nbsp; $http.get("/Home/GetFileList").then(function (result) {&nbsp; &nbsp; &nbsp; &nbsp; console.log(result)&nbsp; &nbsp; &nbsp; &nbsp; $scope.fileList = result.data;&nbsp; &nbsp; })这是在我的 AJS 控制器中，使用 .then 而不是 .success。如果您使用 console.log 从 mvc 控制器返回的结果并在浏览器中查看它，您将看到带有许多其他信息的对象，并且您想要的值位于对象的 .data 部分。因此，要访问您需要执行 result.data 的值。在我的情况下，这给了我和数组。我将它分配给一个范围。然后在我看来，我可以通过执行 {{fileList[1]}} 等来访问这些值。这也可以在 ng-repeat 中使用，例如：<div ng-repeat="file in fileList">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {{fileList[$index]}}</div>重复数组中的每个值都可以使用 $index 访问，它是从 0 开始的重复次数。