dom-repeat return me "Cannot read property 'apply' of undefined" 当我尝试在对象中显示数组时

Question

我在使用 dom-repeat:

时在浏览器控制台收到此错误

Cannot read property 'apply' of undefined

当我尝试在 dom-repeat 中显示对象内部的数组时，

密码是：

<link rel="import" href="../bower_components/polymer/polymer.html">

<dom-module id="hola-mundo">
    <style>
        h1{
            color: blue;
        }
    </style>

    <template>

        <button on-tap="test">myButton</button>             

        <template is="dom-repeat" items="{{myObject.parameters}}">
                <div>{{item.name}}</div>                
        </template>
    </template>
</dom-module>

<script>
    Polymer({
        is: "hola-mundo",
        properties: {
            myObject: {
                type:Object,
                value: {
                    parameters: {
                        type: Array,
                        value: []
                    },
                    color: {
                        type: String,
                        value: 'red'
                    }   
                }
            }

        },

        test: function(){
            this.push('myObject.parameters', { 'id': '1', 'name': 'test'});
        },      
    });
</script>

数组必须在对象内部

有人可以更正我的代码吗？我将不胜感激。

谢谢

更新 1：

在这个 Whosebug 问题中，一个响应被选为有效，但它对我不起作用：

<link rel="import" href="../bower_components/polymer/polymer.html">

<dom-module id="hola-mundo">
    <style>
        h1{
            color: blue;
        }
    </style>

    <template>

        <button on-tap="test">myButton</button>     
        <h1>Hola Mundo <span>{{nombre}}</span></h1>

        <template is="dom-repeat" items="{{rooms.ports}}">
                <div>{{item.portName}}</div>                
        </template>

    </template>
</dom-module>

<script>
    Polymer({
        is: "hola-mundo",
        properties: {
            rooms: {
                type: Array,
                value: [
                    {
                        name: "Room1",
                        maxPorts: 16,
                        ports: {
                            type: Array,
                            value: [

                            {portName: "Port 1",portStatus: "true"},
                            {portName: "Port 2",portStatus: "true"},
                            {portName: "Port 3",portStatus: "true"},
                            {portName: "Port 4",portStatus: "true"},
                            ]
                        }
                    }
                ]
            },

        },

        test: function(){
            this.push('rooms.ports', {portName: "Port 4",portStatus: "true"});
        },      
    });
</script>

Answer 1

这个：

properties: {
  myObject: {
    type: Object,
    value: {
      parameters: {
        type: Array,
        value: []
      },
      color: {
        type: String,
        value: 'red'
      } 
    }
  } 
}

不起作用，因为您试图 "define" parameters 和 color 就好像它们是属性一样（相反，它们只是 myObject 的一部分' s 值）但实际上你正在分配对象文字

{
  parameters: {
    type: Array,
    value: []
  },
  color: {
    type: String,
    value: 'red'
  } 
}

作为 myObject 属性的值。所以 myObject.parameters 在这种情况下是 Object 而不是 Array 因此 this.push 失败。

尝试这样定义 myObject：

properties: {
  myObject: { // Define properties at this level only
    type: Object,
    value: {
      parameters: [], // Parameters is initially an empty array
      color: 'red',
    }
  } 
}

dom-repeat return me "Cannot read property 'apply' of undefined" 当我尝试在对象中显示数组时

dom-repeat return me "Cannot read property 'apply' of undefined" when I try display an array inside an object

polymer

polymer-1.0