我正在关注 angular 的 youtube 教程，我发现将 any 应用于变量是不好的做法，因此我将其更改为分配给我的 List 和 {{1} } 模型，它似乎非常合身
错误信息
Tasktask-view.component.ts
Error: src/app/pages/task-view/task-view.component.ts:27:60 - error TS2769: No overload matches this call.
Overload 1 of 5, '(observer?: NextObserver<Object> | ErrorObserver<Object> | CompletionObserver<Object> | undefined): Subscription', gave the following error.
Argument of type '(tasks: Task[]) => void' is not assignable to parameter of type 'NextObserver<Object> | ErrorObserver<Object> | CompletionObserver<Object> | undefined'.
Property 'complete' is missing in type '(tasks: Task[]) => void' but required in type 'CompletionObserver<Object>'.
Overload 2 of 5, '(next?: ((value: Object) => void) | undefined, error?: ((error: any) => void) | undefined, complete?: (() => void) | undefined): Subscription', gave the following error.
Argument of type '(tasks: Task[]) => void' is not assignable to parameter of type '(value: Object) => void'.
Types of parameters 'tasks' and 'value' are incompatible.
The 'Object' type is assignable to very few other types. Did you mean to use the 'any' type instead?
Type 'Object' is missing the following properties from type 'Task[]': length, pop, push, concat,
and 26 more.
27 this.taskService.getTasks(params.listId).subscribe((tasks: Task[]) => {
~~~~~~~~~~~~~~~~~~~~
node_modules/rxjs/internal/types.d.ts:64:5
64 complete: () => void;
~~~~~~~~
'complete' is declared here.
src/app/pages/task-view/task-view.component.ts:34:42 - error TS2769: No overload matches this call.
Overload 1 of 5, '(observer?: NextObserver<Object> | ErrorObserver<Object> | CompletionObserver<Object> | undefined): Subscription', gave the following error.
Argument of type '(lists: List[]) => void' is not assignable to parameter of type 'NextObserver<Object> | ErrorObserver<Object> | CompletionObserver<Object> | undefined'.
Property 'complete' is missing in type '(lists: List[]) => void' but required in type 'CompletionObserver<Object>'.
Overload 2 of 5, '(next?: ((value: Object) => void) | undefined, error?: ((error: any) => void) | undefined, complete?: (() => void) | undefined): Subscription', gave the following error.
Argument of type '(lists: List[]) => void' is not assignable to parameter of type '(value: Object) => void'.
Types of parameters 'lists' and 'value' are incompatible.
The 'Object' type is assignable to very few other types. Did you mean to use the 'any' type instead?
Type 'Object' is missing the following properties from type 'List[]': length, pop, push, concat,
and 26 more.
34 this.taskService.getList().subscribe((lists: List[]) => {
~~~~~~~~~~~~~~~~~~~~
node_modules/rxjs/internal/types.d.ts:64:5
64 complete: () => void;
'complete' is declared here.
task-view.component.html
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router';
import { TaskService } from 'src/app/task.service';
import { MatDialog } from '@angular/material/dialog';
import { Task } from 'src/app/models/task.model';
import { List } from 'src/app/models/list.model';
@Component({
selector: 'app-task-view',
templateUrl: './task-view.component.html',
styleUrls: ['./task-view.component.scss']
})
export class TaskViewComponent implements OnInit {
lists?: List[];
tasks?: Task[];
constructor(private taskService: TaskService, private route: ActivatedRoute, private dialog: MatDialog) { }
ngOnInit(): void {
this.route.params.subscribe(
(params: Params) => {
//console.log(params);
this.taskService.getTasks(params.listId).subscribe((tasks:Task[]) => {
this.tasks = tasks;
})
}
)
this.taskService.getList().subscribe((lists:List[]) => {
console.log(lists);
this.lists = lists;
})
}
onTaskClick(task: Task) {
// We want to set the task to completed
this.taskService.complete(task).subscribe(() => {
console.log("Completed successfully");
})
}
}
task.service.ts
<div class="centered-content">
<div class="task-manager-container"> <!---->
<div class="sidebar has-background-white">
<h1 class="title has-text-primary">
Lists
</h1>
<div class="list-menu">
<a *ngFor = "let list of lists" class="list-menu-item has-text-primary" [routerLink]= "['/lists', list._id]" routerLinkActive= "is-active">
<p>{{list.title}}</p>
</a>
</div>
<button mat-raised-button class="button is-medium is-primary has-text-light " routerLink = "/new-list">
<mat-icon>add</mat-icon> New List
</button>
</div>
<div class="task-list-container has-background-light">
<h1 class="title has-text-primary">
Tasks
</h1>
<!-- Task Elements -->
<div *ngFor = "let task of tasks" class="task-list has-text-primary" (click) = onTaskClick(task)>
<p> {{ task.title }} </p>
</div>
<button class="circle-add-button button is is-primary" routerLink = "./new-task">
<mat-icon>add</mat-icon>
</button>
</div>
</div>
</div>