Question

所以，这个问题并不是一个错误或者需要修复的东西，因为它是一个窘境。我一直在从AngularJS迁移到Angular 2.因此，我想看看是否有人能够提供令人满意的答案，解释为什么这段代码片段以某种方式起作用：

import { Component } from '@angular/core';
import { TaskService } from './task.service';

@Component({
  selector: 'task-list',
  providers: [TaskService],
  template: `
  <h4>Task List</h4>
  <ul>
    <li *ngFor = "let task of taskService.tasks">
      {{ task.title }} - {{ task.completed }}
      <button (click)="completeTask(task)">Click me!</button>
    </li>
  </ul>
  `
})
export class TaskListComponent {
  completeTask(task) {
    task.completed = true;
    console.log(task)
  }
  constructor(public taskService: TaskService) {

  }
}

请注意，TaskService服务只是在构造对象时建立一个对象数组，不多也不少。

点击<button>后，{{ task. completed }}会在模板中发生变化。但是，在我看来，这应该不起作用。毕竟，不是2-way双向绑定不是Angular 2中的东西？为此，我应该设置一系列事件监听器或使用内置的NgModel指令，对吧？我知道这里必须有一些Angular-thing，因为已经确定调用具有值的函数并不会操纵原始值。

（EG，在普通的JS中，如果你有一个变量，并用该变量调用一个函数，原始变量不被修改，它是副本，参数为你要修改的函数。

从ngFor循环中调用Class方法

0 个答案: