Question

我有下一个组件：

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，任何想法？

谢谢，

Shay Zambrovski

Answer 1

items = [];
addTodoTask(): void {
  this.items.push(this.items.length);
}

<todo *ngFor="let item of items">
<button (click)="addTodoTask()">add</button>

如何在运行时创建角度2选择器？

1 个答案: