Angular传递参数到函数

时间:2018-06-12 11:14:36

标签: angular

我正在尝试将参数传递给给定ID的函数。 这是我的HTML内容的代码。

<header class="card-header">
        <p class="card-header-title">
            {{taskName}}
        </p>
        <p class="card-header-icon">
            <span [ngClass]="colorClass">
                <i class="fas fa-circle"></i>
            </span>
            <button class="card-footer-item button is-primary" (click)='deleteTaskById('{{id}}')'>X</button>
        </p>
    </header>

我是Angular的初学者,我想知道如何以最简单的方式在我的函数中传递{{id}}的内容。

我的控制台上有以下错误消息:

    compiler.js:215 Uncaught Error: Template parse errors:
Unexpected closing tag "button". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("        </span>
            <button class="card-footer-item button is-primary" (click)='deleteTaskById('{{id}}')'>X[ERROR ->]</button>
        </p>
    </header>

这是我的功能实现:

  deleteTaskById(idCard){
    let card = {
      id: idCard,
      deadline: "",
      description: "",
      responsible: {},
      state: "",
      endDate: "",
      priority: ""
    };
    this.taskService.delete(idCard).subscribe(res => {

    });
    console.log("delete task : " + card.id);
  }

谢谢你的帮助。

1 个答案:

答案 0 :(得分:3)

应该只是

<button class="card-footer-item button is-primary" (click)="deleteTaskById(id)">X</button>