如何在 Meter.call() 方法中访问 Angular 2 路由器

Question

我正在使用 Angular2-Meteor 设计一个简单的登录屏幕，我想在登录 API 调用成功后将用户重定向到 /dashboard。

import {Component} from '@angular/core';
import {MeteorComponent} from 'angular2-meteor';
import {LocalStorageService} from '../services/localstorage.service'
import {Router} from '@angular/router-deprecated';
import {LoggerService} from "../services/loggerService";

'use strict';
@Component({
    selector: 'login',
    templateUrl: 'client/login/login.html',
    bindings: [LoggerService]
})

export class LoginComponent extends MeteorComponent {

public loginData = {
    username: '',
    password: ''
};

constructor(private _logger:LoggerService, public router:Router) {
    super();
}

login() {
    this._logger.log('Login attempted ', this.loginData);

    this.call('authenticateUser', this.loginData.username, this.loginData.password , function (err, data) {
        if (err) {
            this._logger.error(err);

        } else {

            console.info(JSON.parse(data));
            console.log(this.router);
            this.router.navigate(['Dashboard'])
        }
      });
    }
}

我无法访问 Meteor.call() 中的路由器。我尝试通过 self = this 将 this 引用传递给 Meteor.call，但它需要 self 作为 Window。

有人可以帮忙吗？提前谢谢你。

Answer 1

您必须使用箭头函数才能在 class 中具有相同的 this 上下文。

像这样更改您的匿名回调函数：

this.call('authenticateUser', 
          this.loginData.username, 
          this.loginData.password, 
          (err, data) => {
   //...
});

提示

尝试查看 promises 或 observables 而不是使用回调函数

Answer 2

您可以像这样将函数绑定到上下文：

this.call('authenticateUser', this.loginData.username, this.loginData.password , function (err, data) {
    if (err) {
        this._logger.error(err);

    } else {

        console.info(JSON.parse(data));
        console.log(this.router);
        this.router.navigate(['Dashboard'])
    }
  }).bind(this);

或者您可以只使用箭头函数：

this.call('authenticateUser', this.loginData.username, this.loginData.password , (err, data) => {
    if (err) {
        this._logger.error(err);

    } else {
        console.info(JSON.parse(data));
        console.log(this.router);
        this.router.navigate(['Dashboard'])
    }
}).bind(this);

如何在 Meter.call() 方法中访问 Angular 2 路由器

How to access Angular 2 router in Meter.call() method

angular2-meteor

angular