Html 从表格中删除选中的行

我有这张桌子

<p-dataTable [value]="example">
    <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
    <p-column field="a" header="column 1"></p-column>
    <p-column field="b" header="column 2"></p-column>
    <p-column field="c" header="column 3"></p-column>
</p-dataTable>

另外，我的表正在创建为

example = [];

ngOnInit() {
    this.example.push({
        a: 'e1',
        b: 'e2',
        c: 'e3'
    });
};

但是如何删除选中的行呢

---

谢谢

首先更改示例数组的结构，让我们准备一个选择数组：

example = [
    {field: 'a', header: 'e1'},
    {field: 'b', header: 'e2'},
    {field: 'c', header: 'e3'},
];

selectedItems = [];

<p-dataTable [value]="example" selectionMode="multiple" [(selection)]="selectedItems">
    <p-column *ngFor="let item of example" [field]="item.field" [header]="item.header"></p-column>        
</p-dataTable>

<button (click)="deleteSelected()">Delete the bastards!</button>

然后生成如下表和列（干式）：

example = [
    {field: 'a', header: 'e1'},
    {field: 'b', header: 'e2'},
    {field: 'c', header: 'e3'},
];

selectedItems = [];

<p-dataTable [value]="example" selectionMode="multiple" [(selection)]="selectedItems">
    <p-column *ngFor="let item of example" [field]="item.field" [header]="item.header"></p-column>        
</p-dataTable>

<button (click)="deleteSelected()">Delete the bastards!</button>

---

这应该可以做到。

首先更改示例数组的结构，让我们准备一个选择数组：

example = [
    {field: 'a', header: 'e1'},
    {field: 'b', header: 'e2'},
    {field: 'c', header: 'e3'},
];

selectedItems = [];

<p-dataTable [value]="example" selectionMode="multiple" [(selection)]="selectedItems">
    <p-column *ngFor="let item of example" [field]="item.field" [header]="item.header"></p-column>        
</p-dataTable>

<button (click)="deleteSelected()">Delete the bastards!</button>

然后生成如下表和列（干式）：

example = [
    {field: 'a', header: 'e1'},
    {field: 'b', header: 'e2'},
    {field: 'c', header: 'e3'},
];

selectedItems = [];

<p-dataTable [value]="example" selectionMode="multiple" [(selection)]="selectedItems">
    <p-column *ngFor="let item of example" [field]="item.field" [header]="item.header"></p-column>        
</p-dataTable>

<button (click)="deleteSelected()">Delete the bastards!</button>

---

这应该就可以了。

谢谢，但是不需要像您那样创建选择数组，可以吗？因为在我的代码中，我使用.push方法创建数组，因为我需要多行，不想为了创建更多行而不断创建新数组。我能问一下，您从哪里获取数组项吗？如果您知道起始项（e1、e2、e3），您应该像我在示例数组的定义中所做的那样创建它们。然后，您可以随时使用push添加到该数组中。您绝对需要选择数组，因为您需要跟踪要删除的数组。要在不使用ngfor（在html部分）中创建表，我只需多次使用pcolumn。那么，我如何获得数组的总索引/大小呢？我遇到的另一个问题是属性示例在类型void上不存在，idk知道它的意思。还是谢谢你的帮助。Np，很高兴我能帮你。好的，有很多问题，我需要在Orer中建立实际的表来帮助您。但是，请不要介意，从你的问题中我感觉到你对打字/角度有点陌生。我强烈建议在这一阶段避免预习，并将重点放在通过课程学习vanila Angular4。你也会有很多坏习惯。嘿，我把它修好了，只是用普通的循环，是的，我对angular和typescript非常陌生（几天）。谢谢，但是，如果不像您那样创建选择数组，是否可以完成此操作？因为在我的代码中，我使用了.push元素创建数组，因为我需要多行，不想继续创建新数组来创建更多行。我可以问一下，您从何处获取数组项吗？如果您知道起始项（e1、e2、e3），您应该像我在示例数组的定义中所做的那样创建它们。然后，您可以随时使用push添加到该数组中。您绝对需要选择数组，因为您需要跟踪要删除的数组。要在不使用ngfor（在html部分）中创建表，我只需多次使用pcolumn。那么，我如何获得数组的总索引/大小呢？我遇到的另一个问题是属性示例在类型void上不存在，idk知道它的意思。还是谢谢你的帮助。Np，很高兴我能帮你。好的，有很多问题，我需要在Orer中建立实际的表来帮助您。但是，请不要介意，从你的问题中我感觉到你对打字/角度有点陌生。我强烈建议在这一阶段避免预习，并将重点放在通过课程学习vanila Angular4。你也会有很多坏习惯。嘿，我把它修好了，只是用普通的循环，是的，我对angular和typescript非常陌生（几天）。