Skip to content

Commit 487af73

Browse files
committed
fix(autocomplete): allow basic use without forms directives
1 parent 4b830d3 commit 487af73

File tree

2 files changed

+50
-2
lines changed

2 files changed

+50
-2
lines changed

src/lib/autocomplete/autocomplete-trigger.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ export class MdAutocompleteTrigger implements AfterContentInit, ControlValueAcce
8484
private _blurStream = new Subject<any>();
8585

8686
/** View -> model callback called when value changes */
87-
_onChange: (value: any) => {};
87+
_onChange = (value: any) => {};
8888

8989
/** View -> model callback called when autocomplete has been touched */
9090
_onTouched = () => {};

src/lib/autocomplete/autocomplete.spec.ts

Lines changed: 49 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe('MdAutocomplete', () => {
2424
imports: [
2525
MdAutocompleteModule.forRoot(), MdInputModule.forRoot(), ReactiveFormsModule
2626
],
27-
declarations: [SimpleAutocomplete],
27+
declarations: [SimpleAutocomplete, AutocompleteWithoutForms],
2828
providers: [
2929
{provide: OverlayContainer, useFactory: () => {
3030
overlayContainerElement = document.createElement('div');
@@ -790,6 +790,27 @@ describe('MdAutocomplete', () => {
790790

791791
});
792792

793+
describe('misc', () => {
794+
795+
it('should allow basic use without any forms directives', () => {
796+
expect(() => {
797+
const fixture = TestBed.createComponent(AutocompleteWithoutForms);
798+
fixture.detectChanges();
799+
800+
const input = fixture.debugElement.query(By.css('input')).nativeElement;
801+
input.value = 'd';
802+
dispatchEvent('input', input);
803+
fixture.detectChanges();
804+
805+
const options =
806+
overlayContainerElement.querySelectorAll('md-option') as NodeListOf<HTMLElement>;
807+
expect(options.length).toBe(1);
808+
809+
}).not.toThrowError();
810+
});
811+
812+
});
813+
793814
});
794815

795816
@Component({
@@ -849,6 +870,33 @@ class SimpleAutocomplete implements OnDestroy {
849870
}
850871

851872

873+
@Component({
874+
template: `
875+
<md-input-container>
876+
<input mdInput placeholder="State" [mdAutocomplete]="auto"
877+
(input)="onInput($event.target?.value)">
878+
</md-input-container>
879+
880+
<md-autocomplete #auto="mdAutocomplete">
881+
<md-option *ngFor="let state of filteredStates" [value]="state">
882+
<span> {{ state }} </span>
883+
</md-option>
884+
</md-autocomplete>
885+
`
886+
})
887+
class AutocompleteWithoutForms {
888+
filteredStates: any[];
889+
states = ['Alabama', 'California', 'Florida'];
890+
891+
constructor() {
892+
this.filteredStates = this.states.slice();
893+
}
894+
895+
onInput(value: any) {
896+
this.filteredStates = this.states.filter(s => new RegExp(value, 'gi').test(s));
897+
}
898+
899+
}
852900

853901
/**
854902
* TODO: Move this to core testing utility until Angular has event faking

0 commit comments

Comments
 (0)