如何将元素的内容放入数组？（对于聚合物 dom-重复）

Question

让我描述一下我的情况和我想做什么。假设我有 2 个自定义元素

x-register.html 和 x-register-card.html

在 x-register.html 中是一张静态的 x-register-card 但也有添加更多卡片的按钮（最多 5 张）。

我究竟如何将我的 x-register-card.html 的内容放入数组，然后在我的主要元素 (x-register.html) 中将其用作

<templare is="dom-repeat" item="cardArray" as="card">
  <section> <!-- wrapper for each card -->
    <x-register-card></x-register-card> <!-- dynamic element -->
  </section> 
</template>

这是我的 x-register-card.html

的代码

<template>
  <style include="shared-styles">
  /* Element */
  :host {
    display: block;
  }

</style>

  <h4>Register</h4>
  <paper-input label="Username"></paper-input>
  <paper-input label="First Name></paper-input>
  <paper-input label="Surname"></paper-input>
  <paper-input label="Password" type="password"></paper-input>

<template>
<script>
(function() {
  'use strict';
  Polymer({

    /**
     * Element configuration.
     */
    is: 'x-register-card',
    property: {
      role: {
        type: String,
        value: ""
      }
    }


  });
})();

属性在 x-register-card 中的作用只是用作 <x-register-card role="My friend"><x-register-card>

的字符串

我正在尝试获取内容（可能是 ID 并将其推送到数组）- 假设我已经有 3 个项目在数组中，所以我的 x-register.html 显示了 3 个注册卡。我该怎么做？

//已编辑问题

Answer 1

<template is="dom-repeat" items="[[cards]]" as="card">
  <section>
    <x-register-card header="[[card.header]]" text="[[card.text]]"></x-register-card>
  </section> 
</template>

<script>
  ...
  function add() {
    this.push('cards', {header: 'card', text: 'some text'});
  }
  ...
</script>

如何将元素的内容放入数组？（对于聚合物 dom-重复）

How do i put content of element into array? (for Polymer dom-repeat)

arrays

polymer

polymer-1.0

如何将元素的内容放入数组？ （对于聚合物 dom-重复）

How do i put content of element into array? (for Polymer dom-repeat)

arrays

polymer

polymer-1.0

如何将元素的内容放入数组？（对于聚合物 dom-重复）