首页 文章

ionic3&angular4遇到未定义的提供者!通常这意味着您具有循环依赖关系

提问于
浏览
1

我是离子和角度的新手 . 以下代码我写道:

task.service.ts:

import { Injectable } from '@angular/core';

import { Task } from '../model/task';
import { Dummy } from '../data/dummy';

@Injectable()
export class Taskservice {

  getAllTaskByUser(uid: String): Task[]{
    console.log('getAllTaskByUser');

    return TASKS;
  }
}

task.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

import { Task } from '../../model/task'
import { TaskService } from '../../service/task.service'


@IonicPage()
@Component({
  selector: 'page-task',
  templateUrl: 'task.html',
  providers: [TaskService]
})
export class TaskPage {
  searchQuery: string = '';
  taskList: string = "notStarted";
  allTasks: Task[];
  notStartedItems: String[];
  startedItems: String[];
  completedItems: String[];
  tab1: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, private taskService: TaskService) {
    this.getAllItems();

    // tab1 =
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad TaskPage');
  }

  getAllItems() {
    this.allTasks = this.taskService.getAllTaskByUser('')
  }

  searchItems(ev: any) {
    // set val to the value of the searchbar
    let val = ev.target.value;

    // if the value is an empty string don't filter the items
    if (val && val.trim() != '') {
      this.allTasks = this.allTasks.filter((item) => {
        return (item.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }
  }

}

task.ts:

export class task {
  id: String;
  taskname: String;
  state: String;
}

dummy.ts:

import { Task } from '../model/task';

export const TASKS: Task[] = [{ "id": "1", "taskname": "作业001", "state": "未完成" },

{ "id": "2", "taskname": "作业002", "state": "已完成" },

{ "id": "3", "taskname": "作业003", "state": "未开始" },

{ "id": "4", "taskname": "作业004", "state": "未开始" }];

启动服务后,我收到错误信息“运行时错误遇到未定义的提供程序!通常这意味着你有一个循环依赖(可能是由于使用'桶'index.ts文件引起的 . ”

有人可以帮忙吗?如果发布此内容有问题,我很抱歉,也是stackoverflow中的新功能 .

1 回答

  • 2

    你的 class TaskService 实际拼写为 Taskservice .

    @Injectable()
    export class Taskservice <-- lower case 's'{
    
      getAllTaskByUser(uid: String): Task[]{
        console.log('getAllTaskByUser');
    
        return TASKS;
      }
    }
    
    @Component({
      selector: 'page-task',
      templateUrl: 'task.html',
      providers: [TaskService] <-- Capital 'S'
    })
    

相关问题