模型没有填充JSON数据

时间:2016-04-26 17:39:46

标签: javascript angularjs twitter-bootstrap angular-ui-grid

我是Angular JS的新手,长期坚持一个特定的问题。

对于UI网格行,列值将在linkcelltemplate中。点击一下,Bootstrap Modal弹出窗口打开,其中有一个case quick search functionality

这是一段代码:

<div ng-controller="CaseSearchCtrl">
    <div ng-show="case.togglePleaseWait">
        <div class="refresh" style="padding:15px;width:100%;height:100px;">
            <h4>Please wait....</h4>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading text-center">
            Case Search
        </div>

        <table class="table table-striped">
            <tr>
                <td>
                    <select name="selSearchType" id="selSearchType" class="form-control" ng-model="case.searchTerm"
                            ng-init="case.searchTerm == 'caseNo'" ng-options="o as o for o in case.searchTerms"></select>
                </td>
                <td><input type="text" class="form-control" placeholder="enter search term" ng-model="case.input" /></td>
                <td><button class="btn btn-default" type="button" ng-click="case.quickSearch()">Quick Search</button></td>
            </tr>
        </table>    
    </div>
</div>

在输入文本框中,我们可以输入一个值并快速搜索。

enter image description here

这是我的控制器代码:

TransactionModule.controller("CaseSearchCtrl", ['$scope', '$uibModal', 'TransactionServices', 'CaseServices', 'CaseDataServices', 'TransactionDataServices', function ($scope, $uibModal, TransactionServices, CaseServices, CaseDataServices,TransactionDataServices) {

    /* Case implementation starts*/
    $scope.case = {

        searchTerm: "caseNo",    
        searchTerms: caseSearchTerms(),
        toggleQuickSearch: true,
        togglePleaseWait: false,
        name: "",
        number: "",
        type: "",
        constName: "",
        userName: "",
        status: "",
    }

    $scope.case.quickSearch = function () {
        $scope.case.togglePleaseWait = true;

        console.log($scope.case.input);

        if ($scope.case.searchTerm == "caseNo") {
            $scope.case.number = $scope.case.input;
        }
        else if ($scope.case.searchTerm == "caseName") {
            $scope.case.name = $scope.case.input;
        }
        else if ($scope.case.searchTerm == "constituentName") {
            $scope.case.constName = $scope.case.input;
        }
        else if ($scope.case.searchTerm == "userName") {
            $scope.case.userName = $scope.case.input;
        }
        else if ($scope.case.searchTerm == "status") {
            $scope.case.status = $scope.case.input;
        }
        else if ($scope.case.searchTerm == "type") {
            $scope.case.type = $scope.case.input;
        }
        var postParams = [
         {
            "CaseId": $scope.case.number,
            "CaseName": $scope.case.name,
            "ReferenceSource" : "",
            "ReferenceId" : "",
            "CaseType": $scope.case.type,
            "CaseStatus": $scope.case.status,
            "ConstituentName": $scope.case.constName,
            "UserName": $scope.case.userName,
            "ReportedDateFrom" : "",
             "ReportedDateTo" : "",
            "UserId": $scope.case.userName
        }]

        console.log("Post params are");

        console.log(postParams);


        CaseServices.getCaseAdvSearchResults(postParams).then(function (result) {
            if (result.length > 0) {
                $scope.case.togglePleaseWait = false;
                //constMultiDataService.setData(result, HOME_CONSTANTS.QUICK_CASE_SEARCH);
                console.log("Setting results for Quick search in TransactionDataServices");
                console.log(result);
             } ..........................

但是,从控制器传递到Web服务时,CaseInputSearchModel始终为NULL。但是在控制台中我可以看到列表被传递。

getCaseAdvSearchResults: function (postCaseSearchParams) {
    console.log("Before sending to controller");
    console.log(postCaseSearchParams);
    return $http.post(BasePath + "CaseNative/AdvSearch", postCaseSearchParams, {
        //  return $http.post(BasePath + "Home/WriteCaseRecentSearches", postCaseSearchParams, {
        headers: {
            "Content-Type": "application/json",
            "Accept": "application/json"
        }
    }).then(function (result) {
        $http.post(BasePath + "Home/WriteCaseRecentSearches", postCaseSearchParams, {
            headers: {
                "Content-Type": "application/json",
                "Accept": "application/json"
            }
        });
        console.log(result);
        return result.data;
    });
},

enter image description here

即使参数在控制台中正确记录。

enter image description here

以下是我想要绑定数据的模型的样子:

public class CaseInputSearchModel
{
    public string CaseId { get; set; }
    public string CaseName { get; set; }
    public string ReferenceSource { get; set; }
    public string ReferenceId { get; set; }
    public string CaseType { get; set; }
    public string CaseStatus { get; set; }
    public string ConstituentName { get; set; }
    public string UserName { get; set; }
    public string ReportedDateFrom { get; set; }
    public string ReportedDateTo { get; set; }
    public string UserId { get; set; }
}

2 个答案:

答案 0 :(得分:1)

Ur模型应该具有与postparams json中相同名称的所有属性...然后只有它将在控制器中映射到它...它是否具有相同名称的所有属性。?

答案 1 :(得分:1)

如果您将[FromBody]添加到AdvSearch方法,是否可以修复它?此外,在AdvSearch中,您有ListCaseInputSearchModel作为类型。

AdvSearch([FromBody] CaseInputSearchModel model)

编辑: 没注意到你发送了一个数组。试试这个方法签名:

AdvSearch([FromBody] IEnuermable<CaseInputSearchModel> model)