角2 - 使用@input傳遞數據到NG2打字機

我使用ng2-typewriter在我的項目，我想它作爲一個單身，這樣我可以重複使用。角2 - 使用@input傳遞數據到NG2打字機

到目前爲止一切都還好，但我已經遇到了插件的預設方法，並且我很難實現我自己的插件的input。

我想將我的@Input firstLine: string;到this.contents = this.tws.format([*]);，但它只接受一個字符串值，並this.firstLine不帶引號沒有反應。

import { Component, ViewChild, ElementRef, OnInit, Input } from '@angular/core'; 
import { TypewriterService, TypewriterContent } from 'ng2-typewriter'; 

@Component({ 
    moduleId: module.id, 
    selector: 'hero-typer', 
    templateUrl: 'hero-typer.component.html' 
}) 

export class HeroTyperComponent implements OnInit { 

    @Input() firstLine: string; 

    name: string; 
    contents: TypewriterContent[] = []; 
    wecraft: TypewriterContent[] = []; 
    isDone: boolean = false; 
    _class: string = ''; 

    constructor(private tws: TypewriterService) { 
     this.name = 'Hello Angular2'; 
     this.contents = this.tws.format(['First line of text ']); 
    } 

    public ngOnInit() { 
    this.contents.map((v: TypewriterContent, i: number) => { 
     if (i === 1) { 
      v.setSpecialWord('10'); 
     } 
    }); 
} 

onDone(isDone: boolean): void { 
    if (isDone) { 
     this._class = 'completed'; 
     this.name = 'The typewriter is done.'; 
     setTimeout(() => this.isDone = isDone, 0); 
     } 
    } 
}

來源

2017-03-16 snkv

名強烈此處鍵入它是字符串類型，這樣this.firstLine如何能接受比其他值？ –

正是我在這裏試圖解決的，這就是爲什麼我提出了參考。 This - 'this.contents = this.tws.format（[this.firstLine]）;'不能使用綁定到標籤，儘管它接受字符串。 – snkv

如果你不確定類型爲什麼不放置任何字符串而不是字符串 –

問題解決了。問題是我已將內容引用放在constructor中，它們應該位於ngOnInit()函數中，而將constructor留給服務。

注：我仍然在學習角2的過程中如果上面這句話什麼沒有意義，請別人誰明白這一點更好，提高了我這一點。

export class HeroTyperComponent implements OnInit { 

    @Input() firstLine: string; 

    name: string; 
    contents: TypewriterContent[] = []; 
    wecraft: TypewriterContent[] = []; 
    isDone: boolean = false; 
    _class: string = ''; 

    constructor(private tws: TypewriterService) { } 

    public ngOnInit() { 
     this.contents.map((v: TypewriterContent, i: number) => { 
      if (i === 1) { 
       v.setSpecialWord('10'); 
      } 
     }); 
     this.name = 'Hello Angular2'; 
     this.contents = this.tws.format([this.firstLine]); 
    }

來源

2017-03-16 10:17:07 snkv

角2 - 使用@input傳遞數據到NG2打字機

回答

相關問題