angular2，如何多次顯示相同的組件

我有一個包含多個步驟組件的嚮導組件，這些步驟由嚮導組件路由，並且嚮導本身被路由到根組件。作爲嚮導的最後一步，我需要一次顯示所有導航步驟，以便在導航時輸入所有數據進行審閱。我怎麼能做到這一點？angular2，如何多次顯示相同的組件

我已經試過：

新增@Injectable()每個踏板組件和用於Angular2注射供應商，但無論怎樣我嘗試過，它總是實例化一個新的實例，所有的數據條目不見了。
傳遞硬編碼引用。不僅可怕的和不好的做法，謝天謝地，它不起作用，因爲你不能訪問組件域外的原型屬性。

所有新鮮的選項。任何事情都歡迎！

2016-04-21 RoninCoder

維護服務中的數據並將視圖綁定到服務而不是組件類，然後每個組件都會顯示相同的數據。

@Injectable() 
class SharedData { 
    name:string; 
} 

@Component({ 
    selector: 'wiz-step1', 
    template` 
<input type="text" [(ngModel)]="sharedData.name"> 
`}) 
export class WizStep1 { 
    constructor(private sharedData:SharedData) {} 
} 

@Component({ 
    selector: 'my-app', 
    directives: [WizStep1], 
    providers: [SharedData], 
    template` 
<wiz-step1></wiz-step1> 
<wiz-step1></wiz-step1> 
`}) 
export class AppComponent {}

Plunker example

對於如何使用更復雜的數據使用的服務也看到

來源

2016-04-22 05:30:33

我會讓組件模型驅動（數據驅動）和重用實現。

比方說你有2個步驟，每個步驟1箇中輸入，讓您創建模型：

private steps = [ 
    { 
     description: 'step 1', 
     value: '0' 
    }, 
    { 
     description: 'step 2', 
     value: '1' 
    } 
]

顯示的每個步驟：

component.model = this.steps[currentStep]; 

<component [model]="steps[currentStep]"></component> 

<input [(ngModel)]="model.value">

顯示所有步驟：

<component [model]="steps[1]"></component>

來源

2016-04-22 00:37:14 kemsky

angular2，如何多次顯示相同的組件

回答

相關問題