Импорт класса в ionic 3 и ошибка при создании экземпляра класса

Question

Я новичок в ionic 3 и пытаюсь зарегистрироваться. У меня есть экран учетных записей с именем account.ts, который входит в src/pages/accounts/accounts.ts, а затем я пытаюсь создать класс, в котором DAO будет ссылаться на этот класс, я создал его в следующем src/dao/dao-accounts.ts местоположении.

Некоторые ошибки отображаются

Мое первое сомнение в том, вы не против этого тока?

import {DAOContas} from '../../dao/da-contacts';

Я также хочу вернуть список данных, но появляется такая ошибка :

uncaught (im promisse): referrererror: значение не определено referenceerror: значение не определено в новом ContasPage

class dao-accounts.ts

export class DAOContas {

  constructor()
  {
    this.list = [];
  }

  getList()
  {
    this.list = [
    {descricao:"Alimentação"},
    {descricao:"Lazer"},
    {descricao:"Transporte"}
    ];

    return this.list;
  }

}

метод ContasPage.ts

    import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { DAOContas } from '../../dao/dao-contas';

@Component({
  selector: 'page-list',
  templateUrl: 'contas.html'
})
export class ContasPage {

  constructor(public navCtrl: NavController, public navParams: NavParams) {
      this.dao = new DAOContas();
      this.listcontas = this.dao.getList();
  }

}

Ошибка возникает при создании DAOContas

Answer 1

Таким образом, проблема здесь связана с шаблоном внедрения зависимостей. См. официальную документацию о том, как это работает, для получения дополнительной информации.

Судя по предоставленному вами коду, похоже, проблема в том, как вы организовали свой код и объявили (или не объявили) определенные переменные.

В своей ContasPage убедитесь, что вы:

• импортировать класс
• объявить переменные
• делать назначения в конструкторе

Итак, в вашем случае вы не объявляли переменные перед конструктором:

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { DAOContas } from '../../dao/dao-contas';

@Component({
  selector: 'page-list',
  templateUrl: 'contas.html'
})
export class ContasPage {

  // declare your vars here:
  dao: any;
  listcontas: any;

  constructor(
    public navCtrl: NavController
  ) {
    this.dao = new DAOContas();
    this.listcontas = this.dao.getList();
  }

}

То же самое в вашем классе, вы забыли объявить список var:

export class DAOContas {

    list: Array<{ descricao: string }>

    constructor() {
        this.list = [];
    }

    getList() {
        this.list = [
            { descricao: "Alimentação" },
            { descricao: "Lazer" },
            { descricao: "Transporte" }
        ];

        return this.list;
    }

}

Кроме того, поскольку ваши DAOContas для меня похожи на провайдера данных, я бы, вероятно, подумал о том, чтобы превратить его в провайдера и внедрить его в вашу страницу с помощью конструктора:

Убедитесь, что DAOContas для инъекций:

import { Injectable } from '@angular/core'

@Injectable()
export class DAOContas {

    list: Array<{ descricao: string }>

    constructor() {
        this.list = [];
    }

    getList() {
        this.list = [
            { descricao: "Alimentação" },
            { descricao: "Lazer" },
            { descricao: "Transporte" }
        ];

        return this.list;
    }

}

Добавьте его в ваш app.module.ts как провайдер:

import { DAOContas } from '../../src/providers/dao-contacts';

@NgModule({
  declarations: [
    bla
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    DAOContas,
    StatusBar,
    SplashScreen,
    { provide: ErrorHandler, useClass: IonicErrorHandler },
    TestProvider
  ]
})
export class AppModule { }

Наконец-то добавьте его на свою страницу:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { DAOContas } from '../../providers/dao-contacts';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage2 {

  listcontas: any;

  constructor(
    public navCtrl: NavController,
    public dao: DAOContas
  ) {
    this.listcontas = this.dao.getList();
    console.log(this.listcontas)
  }

}