简体   繁体   English

PrimeNg Checkbox执行功能

[英]PrimeNg Checkbox execute function

I've been trying to get a function to happen whenever I press a checkbox in a datatable. 我一直试图让每当我按下数据表中的复选框时发生的功能。 Basically what I have is a datatable with default values in it (1 to 10 for example). 基本上,我拥有的是一个带有默认值的数据表(例如1到10)。 Then I give an array of items to my component which are present in an object of mine (2 & 5 for example). 然后,我给我的对象中存在的项目数组(例如2和5)。 now when the grid is constructed It'll all the default elements in the dataTable but Only the data that is in our object will have a checked checkbox next to them. 现在,当构建网格时,它将保留dataTable中的所有默认元素,但是只有我们对象中的数据旁边会具有选中的复选框。 Now what I want to do is to have my addOrRemove function executed wich depending on the state of the checkbox will add or remove a default data object from the array ([2,5] in this case). 现在,我要执行的操作是根据复选框的状态执行addOrRemove函数,这将在数组中添加或删除默认数据对象(在这种情况下为[2,5])。 So 2 or 5 can be unchecked and thus removed from the array and 1,3,4,6,7,8,9,10 can be checked and added to the array. 因此,可以取消选中2或5,从而将其从阵列中删除,然后可以检查1,3,4,6,7,8,9,10并将其添加到阵列中。

I don't realy have a problem writing the code for this but I'm struggling to have my function being executed whenever I press the checkbox. 我确实没有为此编写代码的问题,但是每当我按下复选框时,我都在努力执行我的函数。

this is how I have my checkbox defined in my html file: 这是我在HTML文件中定义复选框的方式:

<p-column header="Included" [style]="{'width':'80px', 'text-align':'center'}">
    <template let-object="rowData" pTemplate="body">
        <p-checkbox binary="true" [(ngModel)]="object.included" (change)="addOrRemoveRow($event,object.data)"></p-checkbox>
    </template>
</p-column>

using this I'm not getting any functions triggered. 使用这个我没有触发任何功能。 In the PrimeNg documentation there is stated that p-checkbox has an event onChange. 在PrimeNg文档中,声明p复选框具有事件onChange。 but whenever I use that I'm getting the error. 但是每当我使用它时,我都会得到错误。

EXCEPTION: Error in http://localhost:3000/app/shared/grid/checkable-grid/checkable-grid.component.html:9:12 caused by:
 self.parentView.context.addOrRemoveRow is not a function

That is whenever I change the (change) to (onChange). 那就是每当我将(change)更改为(onChange)时。

I've read that it has something to do with my checkbox being inside of a template and therefore there is no direct access to my component and its functions. 我已经读到它与模板内的复选框有关,因此无法直接访问我的组件及其功能。 Any help on this would be much appreciated. 任何帮助,将不胜感激。

The answer to this question is: 这个问题的答案是:

Make sure you take enough breaks and read your code carefully. 确保休息片刻,并仔细阅读代码。 In my component I have a function called addOrRemove(), in my html I had addOrRemoveRow(). 在我的组件中,我有一个名为addOrRemove()的函数,在我的html中,我有addOrRemoveRow()。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM