23
<template> <p>
${title}
<span> (by ${speaker})</span>
</p>
</template>
<require from="./slot" />
<h4>Les 4 fantastiques frameworks</h4>
<slot></slot> <!-- Composant slot -->
export class Slot { title= 'Aurelia'; speaker = 'Alban Dauleu';}
import {useView} from 'aurelia-framework';
@useView('autre-template.html')export class Slot { title= 'Aurelia'; speaker = 'Alban Dauleu';}
<span if.bind="speaker"> (by ${speaker})</span>
<slot repeat.for="slot in slots"></slot>
<template> <h2>Ajouter un Slot</h2> <form> ...
<div class="form-group"> <label for="slot-name">Titre</label> <input id="slot-name" type="text" class="form-control" value.bind="slot.title"/> </div>
<button type="button" class="btn btn-primary" click.trigger="addSlot()" id="add-slot">Ajouter</button> </form></template>
<template>
<require from="../slot/slot"></require>
<slot repeat.for="slot of slots" title.bind="slot.title" speaker.bind="slot.speaker"></slot>
</template>
import {bindable} from 'aurelia-framework';
export class Slot { @bindable title; @bindable speaker;}
<template>
<require from="../slot/slot"></require>
<slot repeat.for="slot of slots" title.one-time="slot.title" speaker.two-way="slot.speaker & throttle:666"></slot>
</template>
import {SlotService} from 'backend/slot-service';import {inject} from 'aurelia-framework';
@inject(SlotService)export class Event { title = ‘’; slots = [];
constructor(slotService, title) { this.slotService = slotService; this.title = title; this.slotService.getSlotsByTheme(this.title).then(slots => this.slots = slots); }}
