Skip to content
This repository was archived by the owner on May 19, 2026. It is now read-only.

Commit c02f12b

Browse files
docs(jp): sync selectionChanged event docs for Combo and Simple Combo (#6415)
Add Japanese translation for the new selectionChanged event sections added in en/components/combo.md and en/components/simple-combo.md. Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent da3ad8f commit c02f12b

2 files changed

Lines changed: 41 additions & 0 deletions

File tree

jp/components/combo.md

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -222,6 +222,37 @@ export class MyExampleCombo {
222222
}
223223
```
224224

225+
また、コンボボックスは、選択が確定されてコンポーネントの状態が更新された後に [selectionChanged]({environment:angularApiUrl}/classes/IgxComboComponent.html#selectionChanged) イベントを発生させます。発行されたイベント引数 [IComboSelectionChangedEventArgs]({environment:angularApiUrl}/interfaces/icomboselectionchangedeventargs.html) には、以前の選択、現在の選択、および追加または削除されたアイテムに関する情報が含まれています。`selectionChanging` とは異なり、このイベントはキャンセル不可であり、最終的に確定した選択の状態を反映することが保証されています。コンボボックスが `ngModel` や Angular フォームとともに使用される場合、`selectionChanged` は値変更コールバックが呼び出された後に発行されます。
226+
227+
イベントへのバインドは、`igx-combo` タグの適切な `@Output` プロパティを介して行うことができます。
228+
229+
```html
230+
<igx-combo [data]="cities" displayKey="name" valueKey="id"
231+
(selectionChanged)="handleCitySelectionChanged($event)">
232+
</igx-combo>
233+
```
234+
235+
次の例では、選択が変更されると、ハンドラーが短い要約を更新し、追加および削除されたアイテムの数を追跡します。
236+
237+
```typescript
238+
export class MyExampleCombo {
239+
...
240+
handleCitySelectionChanged(event: IComboSelectionChangedEventArgs): void {
241+
this.updateSelectionSummary(event.displayText, event.newSelection.length);
242+
243+
for (const item of event.added) {
244+
this.highlightAddedCity(item);
245+
}
246+
247+
for (const item of event.removed) {
248+
this.dimRemovedCity(item);
249+
}
250+
251+
this.logSelectionTransition(event.oldSelection, event.newSelection);
252+
}
253+
}
254+
```
255+
225256
## 単一選択
226257

227258
デフォルトでは、Combo コントロールは複数選択を提供します。以下のスニペットは、ハンドラーを `selectionChanging` イベントにアタッチすることで、コンポーネントで単一選択を可能にする方法を示します。

jp/components/simple-combo.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -202,6 +202,16 @@ Simple ComboBox は、選択が変更されるたびに [selectionChanging]({env
202202
</igx-simple-combo>
203203
```
204204

205+
また、Simple ComboBox は、選択が確定されてコンポーネントの状態が更新された後に [selectionChanged]({environment:angularApiUrl}/classes/IgxSimpleComboComponent.html#selectionChanged) イベントを発生させます。発行されたイベント引数 [ISimpleComboSelectionChangedEventArgs]({environment:angularApiUrl}/interfaces/isimplecomboselectionchangedeventargs.html) には、以前の選択、現在の選択、および表示された項目に関する情報が含まれています。`selectionChanging` とは異なり、このイベントはキャンセル不可であり、最終的に確定した選択の状態を反映することが保証されています。Simple ComboBox が `ngModel` や Angular フォームとともに使用される場合、`selectionChanged` はフォームの値が更新された後に発行されます。
206+
207+
イベントへのバインドは、`igx-simple-combo` タグの適切な `@Output` プロパティを介して行うことができます。
208+
209+
```html
210+
<igx-simple-combo [data]="cities" [displayKey]="'name'" [valueKey]="'id'"
211+
(selectionChanged)="handleSelectionChanged($event)">
212+
</igx-simple-combo>
213+
```
214+
205215
<div class="divider--half"></div>
206216

207217
## キーボード ナビゲーション

0 commit comments

Comments
 (0)