@@ -95,7 +95,7 @@ describe('MatChipList', () => {
95
95
96
96
expect ( chips . toArray ( ) . every ( chip => chip . disabled ) ) . toBe ( true ) ;
97
97
98
- fixture . componentInstance . items . push ( 5 , 6 ) ;
98
+ fixture . componentInstance . chips . push ( 5 , 6 ) ;
99
99
fixture . detectChanges ( ) ;
100
100
tick ( ) ;
101
101
fixture . detectChanges ( ) ;
@@ -197,8 +197,8 @@ describe('MatChipList', () => {
197
197
// Focus the middle item
198
198
midItem . focus ( ) ;
199
199
200
- // Remove the middle item
201
- testComponent . items . splice ( 2 , 1 ) ;
200
+ // Destroy the middle item
201
+ testComponent . chips . splice ( 2 , 1 ) ;
202
202
fixture . detectChanges ( ) ;
203
203
204
204
// It focuses the 4th item (now at index 2)
@@ -213,8 +213,8 @@ describe('MatChipList', () => {
213
213
// Focus the last item
214
214
lastItem . focus ( ) ;
215
215
216
- // Remove the last item
217
- testComponent . items . splice ( lastIndex , 1 ) ;
216
+ // Destroy the last item
217
+ testComponent . chips . pop ( ) ;
218
218
fixture . detectChanges ( ) ;
219
219
220
220
// It focuses the next-to-last item
@@ -230,8 +230,8 @@ describe('MatChipList', () => {
230
230
midItem . _blur ( ) ;
231
231
zone . simulateZoneExit ( ) ;
232
232
233
- // Remove the middle item
234
- testComponent . items . splice ( 2 , 1 ) ;
233
+ // Destroy the middle item
234
+ testComponent . chips . splice ( 2 , 1 ) ;
235
235
fixture . detectChanges ( ) ;
236
236
237
237
// Should not have focus
@@ -1322,20 +1322,18 @@ describe('MatChipList', () => {
1322
1322
@Component ( {
1323
1323
template : `
1324
1324
<mat-chip-list [tabIndex]="tabIndex" [selectable]="selectable">
1325
- <mat-chip *ngFor="let i of items"
1326
- (select)="chipSelect(i)"
1327
- (deselect)="chipDeselect(i)">
1325
+ <mat-chip *ngFor="let i of chips" (select)="chipSelect(i)" (deselect)="chipDeselect(i)">
1328
1326
{{name}} {{i + 1}}
1329
1327
</mat-chip>
1330
1328
</mat-chip-list>`
1331
1329
} )
1332
1330
class StandardChipList {
1333
- items = [ 0 , 1 , 2 , 3 , 4 ] ;
1334
1331
name : string = 'Test' ;
1335
1332
selectable : boolean = true ;
1336
1333
chipSelect : ( index ?: number ) => void = ( ) => { } ;
1337
1334
chipDeselect : ( index ?: number ) => void = ( ) => { } ;
1338
1335
tabIndex : number = 0 ;
1336
+ chips = [ 0 , 1 , 2 , 3 , 4 ] ;
1339
1337
}
1340
1338
1341
1339
@Component ( {
@@ -1591,7 +1589,7 @@ class StandardChipListWithAnimations {
1591
1589
template : `
1592
1590
<mat-form-field>
1593
1591
<mat-chip-list>
1594
- <mat-chip *ngFor="let i of chips" [value]="i" (removed)="removeChip($event)">
1592
+ <mat-chip [value]="i" (removed)="removeChip($event)" *ngFor="let i of chips ">
1595
1593
Chip {{i + 1}}
1596
1594
<span matChipRemove>Remove</span>
1597
1595
</mat-chip>
0 commit comments