2017-03-01 8 views
0

私は次のコンポーネントがあります。実行時に角度2セレクタを作成するにはどうすればよいですか?

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'todo', 
    templateUrl: 'app/todo/todo.component.html', 
    styleUrls: ['app/todo/todo.component.css'] 
}) 
export class Todo implements OnInit{ 
    placeHolder: string = "Please enter a TODO task"; 
    taskValue: string = ""; 

    ngOnInit(): void { 

    }; 
} 

を、私はまた、このコンポーネントがあります。

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'main-panel', 
    templateUrl: 'app/main-panel/main-panel.component.html', 
    styleUrls: ['app/main-panel/main-panel.component.css'] 
}) 
export class MainPanel implements OnInit{ 
    panelTitle: string = 'Welcome to ODOT'; 
    sTodo: string = 'TODO'; 
    sDoing: string = 'Doing'; 
    sDone: string = 'Done'; 
    userName: string = 'User name'; 
    password: string = 'Password'; 
    signUp: string = 'Sign up'; 
    signIn: string = 'Sign in'; 

    addTodoTask(): void { 
     console.log("Hi"); 
    }; 

    ngOnInit(): void {  
    }; 
} 

を私は毎回addTodoTaskイベントは、私はそのすべてのプロパティを持つ新しいTODOセレクタを追加するトリガーことをしたいとメインパネルへの方法.HTML、任意のアイデア?あなたは、動的にページ上のコンポーネントのロード

おかげで、

シェイZambrovski

+0

を話していますか? – amansoni211

+0

@ amansoni211そうだと思います... –

+1

これはあなたが探しているものだと思います。 http://stackoverflow.com/documentation/angular2/831/dynamically-add-components-using-viewcontainerref-createcomponent/28405/dynamically-add-component-on-specific-eventclick#t=201703010845477112628 – amansoni211

答えて

0
items = []; 
addTodoTask(): void { 
    this.items.push(this.items.length); 
} 
<todo *ngFor="let item of items"> 
<button (click)="addTodoTask()">add</button> 
+0

アイテム間の接続は何ですか? Todoコンポーネント? –

関連する問題