e4fb93c28a
Currently all playground examples are built with `tsc` and served with the `gulp serve` task. In order to be able to test these examples easily with Ivy, we now build and serve the examples using Bazel. This allows us to expand our Ivy test coverage and additionally it allows us to move forward with the overall Bazel migration. Building & serving individual examples is now very easy and doesn't involve building everything inside of `/modules`. PR Close #28490
72 lines
1.6 KiB
HTML
72 lines
1.6 KiB
HTML
<style>@import "css/base.css";</style>
|
|
|
|
<section id="todoapp">
|
|
|
|
<header id="header">
|
|
<h1>todos</h1>
|
|
<input
|
|
id="new-todo"
|
|
placeholder="What needs to be done?"
|
|
autofocus
|
|
#newtodo
|
|
(keyup.enter)="enterTodo(newtodo)">
|
|
</header>
|
|
|
|
<section id="main">
|
|
<input id="toggle-all" type="checkbox" (click)="toggleAll($event)">
|
|
<label for="toggle-all">Mark all as complete</label>
|
|
|
|
<ul id="todo-list">
|
|
|
|
<li *ngFor="let todo of todoStore.list">
|
|
|
|
<div class="view"
|
|
[class.hidden]="todoEdit == todo">
|
|
|
|
<input class="toggle" type="checkbox"
|
|
(click)="completeMe(todo)"
|
|
[checked]="todo.completed">
|
|
|
|
<label (dblclick)="editTodo(todo)">{{todo.title}}</label>
|
|
<button class="destroy" (click)="deleteMe(todo)"></button>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<input class="edit"
|
|
[class.visible]="todoEdit == todo"
|
|
[value]="todo.title"
|
|
(keyup)="doneEditing($event, todo)">
|
|
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
|
|
</section>
|
|
|
|
<footer id="footer">
|
|
<span id="todo-count"></span>
|
|
<div [class.hidden]="true"></div>
|
|
<ul id="filters">
|
|
<li>
|
|
<a href="#/" class="selected">All</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/active">Active</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/completed">Completed</a>
|
|
</li>
|
|
</ul>
|
|
<button id="clear-completed" (click)="clearCompleted()">Clear completed</button>
|
|
</footer>
|
|
|
|
</section>
|
|
|
|
<footer id="info">
|
|
<p>Double-click to edit a todo</p>
|
|
<p>Created by <a href="http://twitter.com/angular">The Angular Team</a></p>
|
|
</footer>
|