角度承诺后设置标题

Question

我想学习角度，所以我刚刚完成heroes tutorial。

然后我想我会看看改变这个，以便我可以改变每页的文档标题。所以我按照说明添加了title service。

这在我的仪表板页面上可以正常工作，我可以简单地在初始化时调用标题服务，所以我想我会尝试将它添加到我的英雄详细信息页面，以查看是否可以使文档标题成为英雄的名字：

import { Component, Input, OnInit } from '@angular/core'; 
import { Title }     from '@angular/platform-browser'; 
import { ActivatedRoute, Params } from '@angular/router'; 
import { Location }     from '@angular/common'; 

import { Hero }      from '../classes/hero'; 
import { HeroService }    from '../services/hero.service'; 

@Component({ 
    selector: 'my-hero-details', 
    templateUrl: '/app/templates/hero-details.component.template.html' 
}) 

export class HeroDetailsComponent implements OnInit { 
    @Input() 
    hero: Hero; 

    constructor(
     private heroService: HeroService, 
     private route: ActivatedRoute, 
     private location: Location, 
     private titleService: Title 
    ) { } 

    public ngOnInit(): void { 
     this.route.params.forEach((params: Params) => { 
      let id = +params['id']; 

      this.heroService.getHero(id) 
       .then(hero => this.hero = hero) 
       .then(function() { this.setTitle(this.hero.name); }); // this is the line I have added 
     }); 
    } 

    public save(): void { 
     this.heroService.update(this.hero) 
      .then(() => this.goBack()); 
    } 

    public delete(): void { 
     this.heroService 
      .delete(this.hero.id) 
      .then(() => this.goBack()); 
    } 

    public goBack(): void { 
     console.log('back') 
     this.location.back(); 
    } 

    private setTitle(newTitle: string) { 
     this.titleService.setTitle(newTitle); 
    } 
} 

正如你可以从我的代码中看到的，我想设置的主人公许运行后设置标题。然而，似乎没有任何事情发生 - 不会出现错误，标题也不会改变。

我在这里做错了什么？我不会那样连锁吗？

Answer 1

变化

.then(function() { this.setTitle(this.hero.name); }); 

到

.then(() => { this.setTitle(this.hero.name); }); 

保留this

看到也https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Functions/Arrow_functions