如何引用Aurelia自定义元素中的特定元素'；s<；插槽>；？

我想在Aurelia中创建一个自定义字段集，我需要在“slot”标记中设置标签元素的样式（宽度）（参见下面的示例用法）。如何访问这些元素？到目前为止，我得到的是

<template>
  <require from="./ib-fieldset.css"></require>
  <fieldset style.bind="style">
    <legend>${title}</legend>
    <slot></slot>
  </fieldset>
</template>

我是这样用的：

  <ib-fieldset title="Address" top="100" left="200" labelWidth="100">
    <label for="firstName">First name:</label>
    <input id="firstName" type="text">

    <label for="lastName">Last name:</label>
    <input id="lastName" type="text">
  </ib-fieldset><br>

名字：
姓氏：

---

我尝试使用jquery，但我不知道如何仅在字段集组件中选择元素（而不是整个页面，该页面可以包含其他字段集）。

与Aurelia中的大多数情况一样，不需要jquery

吉斯特伦：

fieldset.html

<template>
  <fieldset style="position: absolute; top: ${top}px; left: ${left}px;">
    <legend>${title}</legend>
    <slot ref="slotElement"></slot>
  </fieldset>
</template>

<require from="./fieldset"></require>

<ib-fieldset title="Address" top="100" left="200" label-width="100">
  <label for="firstName">First name:</label>
  <input id="firstName" type="text"/>

  <label for="lastName">Last name:</label>
  <input id="lastName" type="text"/>
</ib-fieldset><br>

consumer.html

<template>
  <fieldset style="position: absolute; top: ${top}px; left: ${left}px;">
    <legend>${title}</legend>
    <slot ref="slotElement"></slot>
  </fieldset>
</template>

<require from="./fieldset"></require>

<ib-fieldset title="Address" top="100" left="200" label-width="100">
  <label for="firstName">First name:</label>
  <input id="firstName" type="text"/>

  <label for="lastName">Last name:</label>
  <input id="lastName" type="text"/>
</ib-fieldset><br>

---

谢谢Jeff，但是我如何设置标签的宽度（请参见我的“labelWidth”属性）？由于插槽中的元素是在使用者中定义的，因此简单地将它们设置在那里是最容易的。请参阅我的最新答案。如果您正在创建一个泛型元素，并且确实希望它设置标签宽度，请告诉我，我将向您展示如何做到这一点。嗨，Jeff，是的，字段集应该可以处理这一点。我更新了我的答案，向您展示一种让自定义元素在内部设置标签宽度的方法。要点是使用

ref=slotElement

获取对slot元素的引用，并在视图模型的

attached

方法中使用该引用来设置标签宽度。顺便说一句，您的原始代码在html中引用了

labelWidth

，而不是

labelWidth

。一个驼峰大小写的javascript bindable在html元素中被引用为kabob大小写属性。是的，它是

querySelectorAll（'label'）我在找什么。我没有让
ref
处理
标记，我必须在其周围放置一个
，然后引用div。非常感谢，杰夫！
import {inject} from ‘aurelia-framework’;

@inject(Element)
export class IbFieldset {
    constructor(element) {
        this.element = element;
    }

    attached() {
        let labels = this.element.querySelectorAll('label');
        ……
    }