Question

我在使用dom-repeat时在浏览器控制台中收到此错误：

无法读取未定义
的属性'apply'

当我尝试在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：

在此stackoverflow问题中，响应被选为有效，但它对我不起作用：

Polymer dom-repeat error parsing the array inside the object

<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'
      } 
    }
  } 
}

无效，因为您正在尝试定义＆＃34; parameters和color就好像它们是属性一样（相反，它们只是myObject值的一部分）但事实上你正在分配对象文字

{
  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返回“无法读取属性'apply'of undefined”

1 个答案: