Question

我目前正在研究MVC4 SinglePage应用程序。

我有一个Web Api方法 GetChartsByCategory（int catId） 所以在我看来cshtml页面如何在这种情况下声明Html.UpshotContext。

我不想调用 GetAllCharts（），然后使用敲除或结果在客户端进行过滤。

由于

Answer 1

使用Html.UpshotContext无法提供参数。您可以使用$ .ajax（）调用GetChartsByCategory（）并将结果映射到您的模型。

示例：

$.ajax("GetChartsByCategory", true, {
    data: { id: catID },
    dataType: 'json',
    success: function (data) {
        // on success, data contains a list of charts
        self.charts(ko.utils.arrayMap(data, function (item) {
            return new Chart(item);
        }));
    }
});

型号：

Chart = function (initialData) {
    var self = this;

    // inject the initial data
    $.each(initialData, function (key, value) {
        self[key] = ko.observable(value);
    });

....
}

Answer 2

另一种允许你坚持淘汰/结束框架的替代方案是改变upshot提供参数操作名称，以包括作为路线和/或查询字符串的一部分的参数。

以下示例使用从HTML收集的'ApplicationId'作为WebAPI调用参数的参数，该方法接受'id'参数作为路由的一部分（'/ api / controller / action / id'）：

控制器方法：

public class ClientDetailsScreenController : DataController
{
    public ClientModel GetClient(int id)
    {
        var client = //Fetch client with id using your prefered method
        return client;
    }
}

查看HTML Upshot上下文：

@(Html.UpshotContext(true).DataSource<ClientDetailsScreenController>(ctr => ctr.GetClient(0))))

请注意，传递给GetClient方法的'0'会被DataSource方法忽略，因此可以使方法签名有效。

淘汰视图模型：

function ClientDetailsViewModel() {
    var self = this;

    //Store the operation name with a leading '/' for use later
    self.operationNameTemplate = upshot.dataSources.Client._providerParameters.operationName + "/";

    //Observable property for the ApplicationId enter via HTML
    self.selectedApplicationId = ko.observable("1");

    //Refresh Data Source Operation - Called in HTML when the ApplicaitonId changes
    self.refresh = function () {
        //Set the upshot operation name to include the id parameter value.
        upshot.dataSources.Client._providerParameters.operationName = self.operationNameTemplate + self.selectedApplicationId();
        //Refresh the data source causing the bound HTMl to be updated.
        self.dataSource = upshot.dataSources.Client.refresh(); 
    };

    //Data Source Setup
    self.refresh();
    self.clients = self.dataSource.getEntities();
}

希望这有助于其他一直试图通过upshot将参数传递到服务器的人。如果有人有更好的方法，请告诉我们。

通过Html.UpshotContext调用带有参数的Web api方法

2 个答案: