Permalink
Browse files

READ: Get all tasks

  • Loading branch information...
1 parent 1f389a3 commit 9b13f6b2f9096fabe15eef5f282be03242a32bc1 @amejiarosario committed Oct 17, 2016
Showing with 29 additions and 15 deletions.
  1. +5 −12 src/app/todo/todo.component.html
  2. +13 −3 src/app/todo/todo.component.ts
  3. +11 −0 src/app/todo/todo.service.ts
@@ -14,21 +14,14 @@
<ul class="todo-list">
<!-- These are here just to show the structure of the list items -->
<!-- List items should get the class `editing` when editing and `completed` when marked as completed -->
- <li class="completed">
+ <li *ngFor="let todo of todos" [ngClass]="{completed: todo.isDone}" >
<div class="view">
- <input class="toggle" type="checkbox" checked>
- <label>Install angular-cli</label>
+ <input class="toggle" type="checkbox" [checked]="todo.isDone">
+ <label>{{todo.title}}</label>
<button class="destroy"></button>
</div>
- <input class="edit" value="Create a TodoMVC template">
- </li>
- <li>
- <div class="view">
- <input class="toggle" type="checkbox">
- <label>Understand Angular2 apps</label>
- <button class="destroy"></button>
- </div>
- <input class="edit" value="Rule the web">
+ <input class="edit"
+ value="{{todo.title}}">
</li>
</ul>
</section>
@@ -1,15 +1,25 @@
import { Component, OnInit } from '@angular/core';
+import { TodoService } from './todo.service';
+
@Component({
selector: 'app-todo',
templateUrl: './todo.component.html',
- styleUrls: ['./todo.component.scss']
+ styleUrls: ['./todo.component.scss'],
+ providers: [TodoService]
})
export class TodoComponent implements OnInit {
+ private todos;
- constructor() { }
+ constructor(private todoService: TodoService) { }
- ngOnInit() {
+ getTodos(){
+ return this.todoService.get().then(todos => {
+ this.todos = todos;
+ });
}
+ ngOnInit() {
+ this.getTodos();
+ }
}
@@ -1,8 +1,19 @@
import { Injectable } from '@angular/core';
+let todos = [
+ { title: 'Install Angular CLI', isDone: true },
+ { title: 'Style app', isDone: true },
+ { title: 'Finish service functionality', isDone: false },
+ { title: 'Setup API', isDone: false },
+];
+
@Injectable()
export class TodoService {
constructor() { }
+ get(){
+ return new Promise(resolve => resolve(todos));
+ }
+
}

0 comments on commit 9b13f6b

Please sign in to comment.