我正在显示产品目录，列出可用的产品以及所有与产品相关的费率计划。每个费率计划都有一个切换按钮，可将产品+费率计划添加到订单中。
以下是添加这些功能的功能，以删除component.ts文件中的订单：
addrateplan(rateplan, product) {
this.selectedRateplans = this.selectedRateplans.concat(rateplan);
this.selectedProducts = this.selectedProducts.concat(product);
this.snackBar.open(rateplan.name + ' added', 'close', {
duration: 3000,
});
}
removerateplan(rateplan, i) {
this.selectedRateplans.splice(i, 1);
this.snackBar.open(rateplan.name + ' removed', 'close', {
duration: 3000,
});
}
toggleChange(event) {
console.log(event);
}
这是.html中的部分，我在其中显示选定的费率计划
<table *ngIf="selectedRateplans">
<tr *ngFor="let rateplan of selectedRateplans; let i = index" [attr.data-index]="i">
<td><button mat-button color="warn" (click)="removerateplan(rateplan, i)">remove</button></td><td>{{ rateplan.name }}</td><td>{{ rateplan.status }}</td>
</tr>
</table>
这是为每个费率计划显示的按钮，用于添加产品和费率计划：
<mat-button-toggle-group #group="matButtonToggleGroup" multiple (change)="toggleChange($event.value)">
<mat-button-toggle value="rateplan" #left>
<mat-icon>add</mat-icon>
</mat-button-toggle>
</mat-button-toggle-group>
// I used to have a normal button and call (click)="addrateplan(rateplan, element) to add rateplans
我确实有三个问题： 1.修复-无法删除费率计划（我认为我使用接头的方式有问题）->请参阅component.ts中的“更新删除”部分
出于可用性的原因，我想更改以前的添加按钮和切换按钮。
如果切换按钮从+（尚未添加产品/费率计划->单击将添加）更改为-（添加产品->单击将删除费率计划）
这是product / rateplan json格式的示例：
{
"products": [{
"id": "8adce42168831a9501688f75d9102aaa",
"sku": "SKU-00001111",
"name": "test 2",
"description": "",
"category": "Base Products",
"effectiveStartDate": "2010-01-27",
"effectiveEndDate": "2100-01-27",
"allowFeatureChanges": false,
"StoreAppID__c": null,
"Prerequisites__c": null,
"Partner_Account_ID__c": null,
"productRatePlans": [{
"id": "8adc8f9968830c1c01688f76d42c4509",
"status": "Active",
"name": "plan 3",
"description": "",
"effectiveStartDate": "2010-01-27",
"effectiveEndDate": "2100-01-27",
"IsTrialRatePlan__c": "False",
"mainIVK__c": null,
"IVK__c": null,
"IVKtype__c": null,
"PriceType__c": "SW",
"VBLO__c": null,
"PriceCode__c": "K",
"CurrencyOfBasePrice__c": "EUR",
"BasePrice__c": null,
"productRatePlanCharges": [{
"id": "8adce42168831a9501688f7791122afd",
"name": "New Component",
"type": "OneTime",
"model": "PerUnit",
"uom": "MB",
"pricingSummary": [
"USD100/MB"
],
"pricing": [{
"currency": "USD",
"price": 100,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": 1,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "One_Time",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": null,
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": null,
"billingPeriodAlignment": null,
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
}]
},
{
"id": "8adce42168831a9501688f767c252aae",
"status": "Active",
"name": "plan 2",
"description": "",
"effectiveStartDate": "2010-01-27",
"effectiveEndDate": "2100-01-27",
"IsTrialRatePlan__c": "False",
"mainIVK__c": null,
"IVK__c": null,
"IVKtype__c": null,
"PriceType__c": "SW",
"VBLO__c": null,
"PriceCode__c": "K",
"CurrencyOfBasePrice__c": "EUR",
"BasePrice__c": null,
"productRatePlanCharges": [{
"id": "8adce42168831a9501688f774d0c2ab0",
"name": "New Component",
"type": "OneTime",
"model": "FlatFee",
"uom": null,
"pricingSummary": [
"USD1000"
],
"pricing": [{
"currency": "USD",
"price": 1000,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "One_Time",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": null,
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": null,
"billingPeriodAlignment": null,
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
}]
},
{
"id": "8adc8f9968830c1c01688f762aac4506",
"status": "Active",
"name": "test",
"description": "",
"effectiveStartDate": "2010-09-05",
"effectiveEndDate": "2100-01-27",
"IsTrialRatePlan__c": "False",
"mainIVK__c": null,
"IVK__c": null,
"IVKtype__c": null,
"PriceType__c": "SW",
"VBLO__c": null,
"PriceCode__c": "K",
"CurrencyOfBasePrice__c": "EUR",
"BasePrice__c": null,
"productRatePlanCharges": [{
"id": "8adc8f9968830c1c01688f771bf4450b",
"name": "one time",
"type": "OneTime",
"model": "FlatFee",
"uom": null,
"pricingSummary": [
"USD15"
],
"pricing": [{
"currency": "USD",
"price": 15,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "One_Time",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": null,
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": null,
"billingPeriodAlignment": null,
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
}]
}
],
"productFeatures": []
},
{
"id": "8adc8f9968830c1c01688a5cbdc7786a",
"sku": "SKU-00001110",
"name": "Malte Test",
"description": "",
"category": "Base Products",
"effectiveStartDate": "2017-09-12",
"effectiveEndDate": "2090-09-12",
"allowFeatureChanges": false,
"StoreAppID__c": null,
"Prerequisites__c": null,
"Partner_Account_ID__c": null,
"productRatePlans": [{
"id": "8adce42168831a9501688a7409736692",
"status": "Active",
"name": "rateplan 2",
"description": "",
"effectiveStartDate": "2018-01-03",
"effectiveEndDate": "2025-01-03",
"IsTrialRatePlan__c": "False",
"mainIVK__c": null,
"IVK__c": null,
"IVKtype__c": null,
"PriceType__c": "SW",
"VBLO__c": null,
"PriceCode__c": "K",
"CurrencyOfBasePrice__c": "EUR",
"BasePrice__c": null,
"productRatePlanCharges": [{
"id": "8adce42168831a9501688a7451576694",
"name": "one time",
"type": "OneTime",
"model": "FlatFee",
"uom": null,
"pricingSummary": [
"USD100"
],
"pricing": [{
"currency": "USD",
"price": 100,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "One_Time",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": null,
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": null,
"billingPeriodAlignment": null,
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
}]
},
{
"id": "8adc8f9968830c1c01688a5db088786c",
"status": "Active",
"name": "Malte rateplan",
"description": "",
"effectiveStartDate": "2017-09-12",
"effectiveEndDate": "2090-09-12",
"IsTrialRatePlan__c": "False",
"mainIVK__c": null,
"IVK__c": null,
"IVKtype__c": null,
"PriceType__c": "SW",
"VBLO__c": null,
"PriceCode__c": "K",
"CurrencyOfBasePrice__c": "EUR",
"BasePrice__c": null,
"productRatePlanCharges": [{
"id": "8adc8f9968830c1c01688a5fa31578bd",
"name": "usage",
"type": "Usage",
"model": "Tiered",
"uom": "Shared Studies",
"pricingSummary": [
"1 to 10 Shared Studies: USD0 flat fee; 11 to 20 Shared Studies: USD10/Shared Studies; 21 to 100 Shared Studies: USD5/Shared Studies"
],
"pricing": [{
"currency": "USD",
"price": null,
"tiers": [{
"tier": 1,
"startingUnit": 1,
"endingUnit": 10,
"price": 0,
"priceFormat": "FlatFee"
},
{
"tier": 2,
"startingUnit": 11,
"endingUnit": 20,
"price": 10,
"priceFormat": "PerUnit"
},
{
"tier": 3,
"startingUnit": 21,
"endingUnit": 100,
"price": 5,
"priceFormat": "PerUnit"
}
],
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "Subscription_End",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": "DefaultFromCustomer",
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": "Month",
"billingPeriodAlignment": "AlignToCharge",
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": "EndOfBillingPeriod",
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
},
{
"id": "8adce42168831a9501688a5e75f16501",
"name": "monthly",
"type": "Recurring",
"model": "FlatFee",
"uom": null,
"pricingSummary": [
"USD50"
],
"pricing": [{
"currency": "USD",
"price": 50,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "Subscription_End",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": "DefaultFromCustomer",
"listPriceBase": "Per_Billing_Period",
"billingTiming": "IN_ADVANCE",
"billingPeriod": "Month",
"billingPeriodAlignment": "AlignToCharge",
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
},
{
"id": "8adc8f9968830c1c01688a5e0770786e",
"name": "sign up",
"type": "OneTime",
"model": "FlatFee",
"uom": null,
"pricingSummary": [
"USD100"
],
"pricing": [{
"currency": "USD",
"price": 100,
"tiers": null,
"includedUnits": null,
"overagePrice": null,
"discountPercentage": null,
"discountAmount": null
}],
"defaultQuantity": null,
"applyDiscountTo": null,
"discountLevel": null,
"discountClass": null,
"productDiscountApplyDetails": [],
"endDateCondition": "One_Time",
"upToPeriods": null,
"upToPeriodsType": null,
"billingDay": null,
"listPriceBase": null,
"billingTiming": null,
"billingPeriod": null,
"billingPeriodAlignment": null,
"specificBillingPeriod": null,
"smoothingModel": null,
"numberOfPeriods": null,
"overageCalculationOption": null,
"overageUnusedUnitsCreditOption": null,
"unusedIncludedUnitPrice": null,
"usageRecordRatingOption": null,
"priceChangeOption": null,
"priceIncreasePercentage": null,
"useTenantDefaultForPriceChange": null,
"taxable": false,
"taxCode": "",
"taxMode": "TaxExclusive",
"triggerEvent": "ContractEffective",
"description": "",
"revRecCode": null,
"revRecTriggerCondition": null,
"revenueRecognitionRuleName": "Recognize upon invoicing",
"useDiscountSpecificAccountingCode": null,
"financeInformation": {
"deferredRevenueAccountingCode": "Professional Services Revenue",
"deferredRevenueAccountingCodeType": "SalesRevenue",
"recognizedRevenueAccountingCode": "Professional Services Revenue",
"recognizedRevenueAccountingCodeType": "SalesRevenue"
}
}
]
}
],
"productFeatures": []
}
]
}
答案 0 :(得分：0)
这将帮助您解决第一个问题，
this.selectedRateplans = this.selectedRateplans.splice(i, 1);
要进行拼接，您需要传递索引。但是您尝试的是在数组中找到实际索引的索引。
下一个问题尚不清楚。请提供演示或进一步的说明。
答案 1 :(得分：0)
您的拼接功能不正确。 拼接的语法
test_regex您需要给一个索引，然后是要从该索引中替换的项目数，然后是要替换的项目。看看here
您已经将索引i传递给removerateplan（）方法。不需要array.splice(index, howmany, item1, ....., itemX)
。
您更新后的功能将会
this.selectedRateplans.indexOf(i)