framadate-responsive/src/app/pages/dates/dates.component.html

<div i18n>
	{{"dates.title"|translate}}
</div>

<div>
	<label for="multi_hours">
		<span i18n>
			Je souhaite mettre des créneaux horaires
		</span>
		<select
			name="multi_hours"
			id="multi_hours"
			[(ngModel)]="config.allowSeveralHours"
		>
			<option value="true">{{"dates.multiple.different"|translate}}</option>
			<option value="false">{{"dates.multiple.identical"|translate}}</option>
		</select>
		<span i18n>
			pour chaque journée
		</span>
	</label>
</div>

<button
	class="btn btn-primary"
	(click)="addDate()"
	i18n
>
	{{"dates.add"|translate}}
</button>
<div class="dates-list">
	{{config.dateList.length}}
	<span i18n>
		{{"dates.count_dates"|translate}}
	</span>

	<div
		*ngFor="let choice of config.dateList; index as id"
		class="date-choice"
	>
		<input
			type="text"
			name="dateChoices[]"
			[(ngModel)]="choice.literal"
		>

		<button (click)="config.dateList.splice(id, 1)">X</button>
	</div>
</div>

<a
	[routerLink]="'/step/end'"
	class="btn btn-block"
>
	C'est parfait!
</a>