Angular2 - 找不到名称 - 构造函数,公共,路由器

时间:2017-04-21 16:32:26

标签: angular typescript auth0

我正在尝试配置auth0 API。最后我做到了,昨天它有效。今天它不是 - 但我没有改变任何代码 - 我在WebStorm中有文件历史记录。

看起来问题在于

  

构造函数(公共路由器:路由器)

这是我的配置:

@angular/cli: 1.0.0
node: 7.7.3
os: win32 x64
@angular/common: 2.4.10
@angular/compiler: 2.4.10
@angular/core: 2.4.10
@angular/forms: 2.4.10
@angular/http: 2.4.10
@angular/platform-browser: 2.4.10
@angular/platform-browser-dynamic: 2.4.10
@angular/router: 3.4.10
@angular/cli: 1.0.0
@angular/compiler-cli: 2.4.10

auth.service.ts

import { Injectable }      from '@angular/core';
import { tokenNotExpired } from 'angular2-jwt';
import { myConfig }        from './auth.config';

// Avoid name not found warnings
declare var Auth0Lock: any;

@Injectable()
export class Auth {
  // Configure Auth0
  lock = new Auth0Lock(myConfig.clientID, myConfig.domain, {});

  constructor() {
    // Add callback for lock `authenticated` event
    this.lock.on("authenticated", (authResult) => {
      localStorage.setItem('id_token', authResult.idToken);
    });
  }

  public login() {
    // Call the show method to display the widget.
    this.lock.show();
  }

  public authenticated() {
    // Check if there's an unexpired JWT
    // This searches for an item in localStorage with key == 'id_token'
    return tokenNotExpired('id_token');
  }

  public logout() {
    // Remove token from localStorage
    localStorage.removeItem('id_token');
  }
}

import { Router, NavigationStart } from '@angular/router';
import 'rxjs/add/operator/filter';

constructor(public router: Router) {
  this
    .router
    .events
    .filter(event => event instanceof NavigationStart)
    .filter((event: NavigationStart) => (/access_token|id_token|error/).test(event.url))
    .subscribe(() => {
      this.lock.resumeAuth(window.location.hash, (error, authResult) => {
        if (error) return console.log(error);
        localStorage.setItem('id_token', authResult.idToken);
        this.router.navigate(['/']);
      });
    });
}

这是控制台抛出的内容:

ERROR in C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,26): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,36): ';' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,1): Cannot find name 'constructor'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,13): Cannot find name 'public'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): Cannot find name 'router'.

ERROR in C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,26): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,36): ';' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,1): Cannot find name 'constructor'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,13): Cannot find name 'public'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): Cannot find name 'router'.

ERROR in ./src/app/auth.service.ts
Module parse failed: C:\xampp\htdocs\untitled\SmartHome\node_modules\@ngtools\webpack\src\index.js!C:\xampp\htdocs\untitled\SmartHome\src\app\auth.service.ts The keyword 'public' is reserved (44:12)
You may need an appropriate loader to handle this file type.
| import { Router, NavigationStart } from '@angular/router';
| import 'rxjs/add/operator/filter';
| constructor(public, router, Router);
| {
|     this
 @ ./src/app/login/login.component.ts 11:0-39
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
webpack: Failed to compile.

任何人都可以帮忙吗?

1 个答案:

答案 0 :(得分:3)

这段代码错了:

import { Router, NavigationStart } from '@angular/router';
import 'rxjs/add/operator/filter';

constructor(public router: Router) {
  this
    .router
    .events
    .filter(event => event instanceof NavigationStart)
    .filter((event: NavigationStart) => (/access_token|id_token|error/).test(event.url))
    .subscribe(() => {
      this.lock.resumeAuth(window.location.hash, (error, authResult) => {
        if (error) return console.log(error);
        localStorage.setItem('id_token', authResult.idToken);
        this.router.navigate(['/']);
      });
    });
}

错误消息:

| import { Router, NavigationStart } from '@angular/router';
| import 'rxjs/add/operator/filter';
| constructor(public, router, Router);
| {
|     this

因此构造函数必须属于一个类,而不是独立的。

例如:

export class YouClassService {
  constructor(public router: Router) {}
}