当前位置:  开发笔记 > 编程语言 > 正文

具有复杂对象的角度形式模型

如何解决《具有复杂对象的角度形式模型》经验,为你挑选了1个好方法。

我正在使用Angular Formly,如果模型是范围的值,就像字符串一样,效果很好:

{
    key: 'name',
    type: 'input'
}

问题是我使用更精细的对象来处理模型,使用"controller as"语法并将名称作为用户对象的一部分:

vm.user = {name: 'john', lastname: 'doe'} 

当然,关键是:

{
    key: 'user.name',
    type: 'input'
}

(通常vm以形式表示法从键中取出).

问题是Formly使用括号表示法来处理模型:

template = ''

处理时,吐出此输出:


当然,模型没有用户对象和空字段显示.

所以,我的问题是:当它是一个更复杂的对象时,如何将适当的对象传递或链接到形式模型?

提前致谢.



1> masa..:

可以在表单和字段级别定义模型,因此很容易将对象图中的任何属性用作表单字段.一个例子:

标记:

JavaScript的:

angular
  .module('myApp', ['formly', 'formlyBootstrap'])
  .controller('MyCtrl', ['$scope', function($scope) {

    var vm = this;

    vm.data = {
        user: {
            name: 'john',
            lastname: 'doe'
        },
        extra: 'extra'
    };

    vm.userFields = [
        {
        model: vm.data.user,
        key: 'name',
        type: 'input',
        templateOptions: {
            type: 'text',
            label: 'Name',
            placeholder: 'Enter name'
            }
        },
        {
        model: vm.data.user,
        key: 'lastname',
        type: 'input',
        templateOptions: {
            type: 'text',
            label: 'Lastname',
            placeholder: 'Enter lastname'
            }
        },
        {
        key: 'extra',
        type: 'input',
        templateOptions: {
            type: 'text',
            label: 'Extra',
            placeholder: 'Enter extra'
        }}
    ];
}]);

小提琴:http://jsfiddle.net/masa671/c37gxg3h/

推荐阅读
手机用户2502852037
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有