Question

我有一个带有动态模型的工作角形。

<input type="text" ng-model="formData[component.model]">

从json结构中检索component.model，如下所示：

{
    "components": [
        {
            "model": "address.street"
        },
        {
            "model": "address.postcode"
        },
        {
            "model": "adress.city"
        }
    ]
}

这样可以正常工作，除了表单提交的结果是平的，看起来像这样：

{
    "name": "John",
    "address.street": "kingsway road",
    "address.postcode": "SE16EH",
    "address.city": "London"
}

我需要更复杂的json，如：

{
    "name": "John",
    "address": {
        "street": "kingsway road",
        "postcode": "SE16EH",
        "city": "London"
    }
}

当我将ng-model硬编码为例如：

时，一切正常

ng-model="formData.address.street"

但是由于动态的东西，生成的json是平的。

有谁知道如何才能让它发挥作用？

Answer 1

我遇到了和你一样的问题，我终于找到了解决方案：https://stackoverflow.com/a/32096328/7126683

所以你只需要创建一个像这样的新指令：

this.app.directive('dynamicModel', ['$compile', '$parse', function ($compile, $parse) {
return {
    restrict: 'A',
    terminal: true,
    priority: 100000,
    link: function (scope, elem) {
        var name = $parse(elem.attr('dynamic-model'))(scope);
        elem.removeAttr('dynamic-model');
        elem.attr('ng-model', name);
        $compile(elem)(scope);
    }
};

在模板中，将ng-model替换为动态模型。

<input dynamic-model="'formData.' + component.model" type="text">

如何在角度中使用动态ng模型时提交嵌套的json

1 个答案: