Question

我正在关注Ionic 4待办教程，并想将任务的完成方式从复选框更改为滑动项目。我可以渲染项目，但是在尝试实现实际的滑块时会卡住。

这是我的html：

<ion-list>
    <ion-item-sliding>
        <ion-item *ngFor="let task of filtered | async; trackBy: trackById">
            <span [class.complete]="task.status === 'complete'">{{ task.name }}</span>
        </ion-item>
        <ion-item-options side="end">
            <ion-item-option color="success" (click)="toggleStatus(task)">
                Complete
            </ion-item-option>
        </ion-item-options>
        <ion-item-options side="start">
            <ion-item-option (click)="showTaskForm(task)">Edit</ion-item-option>
            <ion-item-option color="danger" (click)="deleteTask(task)">Delete</ion-item-option>
        </ion-item-options>
    </ion-item-sliding>
</ion-list>

这是我的 .ts 文件：

...
import { ModalController, IonItemSliding } from '@ionic/angular'; 
...


tasks;
filtered;
filter = new BehaviorSubject(null);

constructor(public auth: AuthService, private db: DatabaseService, public modal: ModalController, public slider: IonItemSliding) {
    //
}

...

toggleStatus(task) {
    console.log('task', task);
    const status = (task.status === 'complete') ? 'incomplete' : 'complete';
    console.log('status:', status);
    this.db.updateAt(`task/${ task.id }`, { status });
}

...

deleteTask(task) {
    this.db.delete(`task/${ task.id }`);
}


trackById(idx, task) {
    return task.id;
}

我相信在两件事上遇到麻烦。

一个人能够将task向下传递到ion-options task始终是不确定的。查看文档，我不确定是否正确导入了东西。据我所知，该html看起来不错，但不确定.ts文件。

另一个实际上是正确导入/注入它。

错误：StaticInjectorError（AppModule）[首页-> IonItemSliding]： StaticInjectorError（平台：核心）[首页-> IonItemSliding]： NullInjectorError：没有IonItemSliding提供程序！

谢谢您的任何建议！

如何使物品通过离子性物品滑动

0 个答案: