Provides @angular/material composition-component for chips with autocomplete.
//app.module.ts
import {ChipsModule} from '@ns/ships';
@NgModule({
imports: [
ChipsModule,
...
],
...
})
export class AppModule {}
<!--app.component.html-->
<ns-chips placeholder="Options" [(ngModel)]="selectedOptions" required>
<ns-chip-option *ngFor="let option of availableOptions" [value]="option.value">{{option.name}}</ns-chip-option>
</ns-chips>
//app.component.ts
@Component({
...
})
class AppComponent {
availableOptions = [{value: 1, name: 'One'}, {value: 2, name: 'Two'}];
}
//styles.scss
@import '~@angular/material/theming';
@import '~@ns/chips/lib/theming';
@include mat-core();
$primary: mat-palette($mat-indigo);
$accent: mat-palette($mat-orange);
$warning: mat-palette($mat-red);
$theme: mat-light-theme($primary, $accent, $warning);
@include angular-material-theme($theme);
@include ns-chips-theme($theme);