如何将项目推入角度列表

Question

首先，谢谢您抽出时间阅读本文并可能帮助我。

我创建了一个列表，我想向其中添加一个项目，该项目是从AJAX调用到MVC控制器

打字稿：

export class FunctionalityComponent {
  public items = [{ Name: "Name", Nachname: "Nachname" },
    { Name: "Name", Nachname: "Nachname" },
    { Name: "Name", Nachname: "Nachname" }];
  }
  addRowMVC() {
    $.ajax({
      url: '/Functionality/AddRow',
      type: 'post',
      success: function (data) {
        this.items.push({Name: data.name, Nachname: data.nachname});
      },
      error: function () {
        alert("error");
      }
  });
}

MVC-Controller：

class Normal
{
    public string Name;
    public string Nachname;
    public Normal(string name, string nachname)
    {
        Name = name;
        Nachname = nachname;
    }
}
public JsonResult AddRow()
{
    var a = new Normal("aa", "bb" );
    return Json(a);
}

查看：

<button (click)="addRowMVC()" class="btn btn-success">Add Row via MVC</button>
<table>
  <thead>
    <tr>
      <th *ngFor="let head of items[0] | keys">{{head}}</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of items">
      <td *ngFor="let list of item | keys">{{item[list]}}</td>
    </tr>
  </tbody>
</table>

这可能是使它起作用的糟糕尝试，这就是为什么我要你们提供帮助的原因。如果我尝试我的代码，则会给我一个错误。

希望你们能帮助我。

问候Nico aka。Myridor

Answer 1

尝试此解决方案

export class FunctionalityComponent {
  public items = [{ Name: "Name", Nachname: "Nachname" },
    { Name: "Name", Nachname: "Nachname" },
    { Name: "Name", Nachname: "Nachname" }];
  }
  addRowMVC() {
  let state = this;
    $.ajax({
      url: '/Functionality/AddRow',
      type: 'post',
      success: function (data) {
        state.items.push({Name: data.name, Nachname: data.nachname});
      },
      error: function () {
        alert("error");
      }
  });
}

Answer 2

尝试以下解决方案：

export class FunctionalityComponent {
    public items = [{ Name: "Name", Nachname: "Nachname" },
      { Name: "Name", Nachname: "Nachname" },
      { Name: "Name", Nachname: "Nachname" }];
    }
    addRowMVC() {
      let that = this;
      $.ajax({
        url: '/Functionality/AddRow',
        type: 'post',
        success: function (data) {
            that.items.push({Name: data.name, Nachname: data.nachname});
        },
        error: function () {
          alert("error");
        }
    });
  }