離子無法找到模塊'../providers/auth-service/auth-service'

我想創建離子角3.3.0登錄/註冊。我得到錯誤無法找到模塊'../providers/auth-service/auth-service'。在login.ts文件中。請幫忙！離子無法找到模塊'../providers/auth-service/auth-service'

AUTH-service.ts

 import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 

/* 
    Generated class for the AuthServiceProvider provider. 

    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
    for more info on providers and Angular 2 DI. 
*/ 
export class User { 
    name: string; 
    email: string; 

    constructor(name: string, email: string) { 
    this.name = name; 
    this.email = email; 
    } 
} 
@Injectable() 
export class AuthServiceProvider { 
    currentUser: User; 
    public login(credentials) { 
    if (credentials.email === null || credentials.password === null) { 
     return Observable.throw("Please insert credentials"); 
    } else { 
     return Observable.create(observer => { 
     // At this point make a request to your backend to make a real check! 
     let access = (credentials.password === "pass" && credentials.email === "email"); 
     this.currentUser = new User('ian', '[email protected]'); 
     observer.next(access); 
     observer.complete(); 
     }); 
    } 
    } 
public register(credentials) { 
    if (credentials.email === null || credentials.password === null) { 
     return Observable.throw("Please insert credentials"); 
    } else { 
     // At this point store the credentials to your backend! 
     return Observable.create(observer => { 
     observer.next(true); 
     observer.complete(); 
     }); 
    } 
    } 
    public getUserInfo() : User { 
    return this.currentUser; 
    } 

    public logout() { 
    return Observable.create(observer => { 
     this.currentUser = null; 
     observer.next(true); 
     observer.complete(); 
    }); 
    } 
}

login.ts

import { Component } from '@angular/core'; 
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular'; 
import { AuthServiceProvider } from '../providers/auth-service/auth-service'; 

@IonicPage() 
@Component({ 
    selector: 'page-login', 
    templateUrl: 'login.html', 
}) 
export class LoginPage { 
    loading: Loading; 
    registerCredentials = { email: '', password: '' }; 

    constructor(private nav: NavController, private auth: AuthServiceProvider, private alertCtrl: AlertController, private loadingCtrl: LoadingController) { } 

    public createAccount() { 
    this.nav.push('RegisterPage'); 
    } 

    public login() { 
    this.showLoading() 
    this.auth.login(this.registerCredentials).subscribe(allowed => { 
     if (allowed) {   
     this.nav.setRoot('HomePage'); 
     } else { 
     this.showError("Access Denied"); 
     } 
    }, 
     error => { 
     this.showError(error); 
     }); 
    } 

    showLoading() { 
    this.loading = this.loadingCtrl.create({ 
     content: 'Please wait...', 
     dismissOnPageChange: true 
    }); 
    this.loading.present(); 
    } 

    showError(text) { 
    this.loading.dismiss(); 

    let alert = this.alertCtrl.create({ 
     title: 'Fail', 
     subTitle: text, 
     buttons: ['OK'] 
    }); 
    alert.present(prompt); 
    } 
}

截圖程序結構：

來源

2017-05-28 Ian Likono

你可以附上你的項目結構的截圖嗎？ –

我已經添加login.ts –

我有addes login.ts和auth-service.ts –

從你的項目結構，你的login.ts是裏面的登錄文件夾，和login文件夾裏面pages文件夾。

所以爲了達到providers文件夾，你需要寫

'../../providers/auth-service/auth-service'

這應該你搬出這應該解決這一問題的兩個文件夾中。

來源

2017-05-28 11:21:11

非常感謝它已經工作 –

不客氣。 –

像一個魅力工作：D –

如果您使用的是VS Code，請安裝名爲「Typescript Hero」和「Typescript Toolbox」的插件，將幫助您導入。

實際上，「Typescript Toolbox」會在您將光標聚焦到導入的元素上時顯示燈泡，並且您可以從燈泡中選擇導入。非常有用。

來源

2017-05-28 14:54:06 Mystearica

離子無法找到模塊'../providers/auth-service/auth-service'

回答

相關問題