Knockout.js映射忽略

时间:2013-12-09 13:08:43

标签: javascript jquery knockout.js knockout-mapping-plugin jquery-select2

我们正在使用.NET MVC 4上的knockout.js和knockout.mapping.js。假设我有这样的JSON:

{
    "deliveryPointType": "0",
    "deliveryPointTypes": [
        {
            "id": 0,
            "text": "Pridėti rankiniu būdu"
        },
        {
            "id": 1,
            "text": "Siųsti visiems regiono objektams"
        }
    ],
    "showRegionSelection": false,
    "showDeliveryPointSelection": true,
    "regionId": "",
    "userHasRegions": "False",
    "propertyNames": {
        "deliveryPointTypeName": "Pridėti rankiniu būdu"
    },
    "initialMaterials": [
        {
            "quantity": 0,
            "materialTypeId": "",
            "propertyNames": {},
            "validMaterial": true,
            "showMaterialError": false,
            "materialTypeAjax": {
                "quietMillis": 300,
                "cache": false,
                "dataType": "json",
                "type": "GET",
                "url": "/lt-LT/Material/MaterialTypeNameLookup"
            }
        }
    ],
    "deliveryBuildings": [
        {
            "clientId": "1",
            "buildingId": "1",
            "regionId": "",
            "newBuilding": false,
            "validClient": true,
            "validBuilding": true,
            "validRegion": true,
            "showClientError": false,
            "showBuildingError": false,
            "showRegionError": false,
            "propertyNames": {
                "clientName": "klientas",
                "buildingName": "ASD project, Antagynės gatvė, Kaunas, Lietuvos Respublika"
            },
            "clientAjax": {
                "quietMillis": 300,
                "cache": false,
                "dataType": "json",
                "type": "GET",
                "url": "/lt-LT/Task/PayerLookup"
            },
            "buildingAjax": {
                "quietMillis": 300,
                "cache": false,
                "dataType": "json",
                "type": "GET",
                "url": "/lt-LT/Object/GetClientAddressListByQuery"
            },
            "regionAjax": {
                "quietMillis": 300,
                "cache": false,
                "dataType": "json",
                "type": "GET",
                "url": "/lt-LT/Object/RegionNameLookup"
            }
        }
    ],
    "hasNewBuildings": false,
    "showBuildingValidation": false,
    "showMinimumBuildingRequiredValidation": false,
    "showMaterialValidation": false,
    "validRegion": true,
    "showRegionError": false,
    "regionAjax": {
        "quietMillis": 300,
        "cache": false,
        "dataType": "json",
        "type": "GET",
        "url": "/lt-LT/Object/RegionNameLookup"
    } 
}

在表单提交失败(如果出现问题/服务无效)时,将使用以前的值重新填充。我们在使用$('#BuildingsJSON').val(ko.mapping.toJSON(viewModel.deliveryBuildings))的表单提交时将ViewModel转换为JSON。

在表单重新填充时,我们用ko.mapping.fromJSON(deliveryBuildings, mapping, viewModel.deliveryBuildings)();解析JSON mapping现在只是一个空对象(尝试“忽略”但没有运气)。

我们使用select2字段从列表中选择建筑物的地址(使用ajax)。事实上,fromJSON几乎将每个json属性填充为可观察的,我不需要。在select2打开时,我们得到一个例外:

  

Uncaught TypeError:Object function observable(){           if(arguments.length> 0){               //写

        // Ignore writes if the value hasn't changed
        if (!observable['equalityComparer'] || !observable['equalityComparer'](_latestValue, arguments[0])) {
            observable.valueWillMutate();
            _latestValue = arguments[0];
            if (DEBUG) observable._latestValue = _latestValue;
            observable.valueHasMutated();
        }
        return this; // Permits chained assignments
    }
    else {
        // Read
        ko.dependencyDetection.registerDependency(observable); // The caller only needs to be notified of changes if they did a "read"
     

操作               return _latestValue;           }       没有方法'toUpperCase'

我调试了它破坏的地方 - 在ajax调用的type属性上。我想我们需要将ajax属性从强制转换为observable。

所以,问题是: 如何将特定对象的特定属性转换为observable()?使用映射插件是否足够,是否需要额外的插件或甚至不可能?

1 个答案:

答案 0 :(得分:2)

您是否考虑过在映射绑定中使用copy关键字?这只是将值复制到js属性中,而不是使其成为可观察的。

来自documentation

var mapping = {
    'copy': ["propertyToCopy"]
}
ko.mapping.fromJS(data, mapping, viewModel);