javascript - 使用 ajax 返回 Controller 方法值

Question

我有一个函数，使用 ajax 调用 Controller 方法

function CallService(data) {
        $.ajax({
            url: '@Url.Action("MyMethod", "MyController")',
            type: 'GET',
            dataType: 'json',
            cache: false,
            data: { 'serializedMessage': data }                
        });

MyMethod() 返回一个复杂的对象，我需要在页面上显示一些属性。

<script>
    $(function(){          

            // create inputData

            function (inputData) {                
                var myItem = CallService(inputData);                
                $('#name').text(myItem.Name);
            };
        });        
</script>

由于 ajax 没有返回任何内容，我在页面上收到一条错误消息“myItem is undefined”。谁能解释一下如何返回一个变量并在 JS 函数中使用它？

Answer 1

我很惊讶您在任何地方都找不到这样的示例，但这里是:

有几种不同的方法可以定义在 ajax 调用完成时运行的回调，如 http://api.jquery.com/jquery.ajax/ 中的文档所示。 。这是一个基于 Promise API 的:

function (inputData) {                
    $.ajax({
        url: '@Url.Action("MyMethod", "MyController")',
        type: 'GET',
        dataType: 'json',
        cache: false,
        data: { 'serializedMessage': inputData }
    }).done(function(result) {
        console.log(JSON.stringify(result)); //just for debugging, to see the structure of your returned object
        $('#name').text(result.Name);
    });
}

您需要掌握的一件事是 ajax 调用是异步运行的，因此您之前的结构将不起作用 - 您无法直接从“CallService”包装器返回任何内容，这使得它变得多余。您必须等到 ajax 调用完成，然后运行依赖于“done”回调内(或调用的函数内)结果的任何代码。

根据我链接到的文档，如果您愿意，您还可以为任务定义其他回调，例如处理错误。