@@ -29,14 +29,11 @@ import { I18n } from "./../i18n/i18n.module";
2929 selector : "ibm-dropdown" ,
3030 template : `
3131 <div
32- class="bx--list-box"
32+ class="bx--list-box bx--dropdown-v2 "
3333 [ngClass]="{
3434 'bx--dropdown--light': theme === 'light',
35- 'bx--dropdown': !skeleton,
3635 'bx--list-box--inline': inline,
37- 'bx--skeleton': skeleton,
38- 'bx--dropdown-v2': skeleton,
39- 'bx--form-item': skeleton
36+ 'bx--skeleton': skeleton
4037 }">
4138 <button
4239 type="button"
@@ -222,28 +219,29 @@ export class Dropdown implements OnInit, AfterContentInit, OnDestroy {
222219 * Initializes classes and subscribes to events for single or multi selection.
223220 */
224221 ngAfterContentInit ( ) {
225- if ( this . view ) {
226- this . view . type = this . type ;
227- this . view . size = this . size ;
228- this . view . select . subscribe ( event => {
229- if ( this . type === "multi" ) {
230- this . propagateChange ( this . view . getSelected ( ) ) ;
231- } else {
232- this . closeMenu ( ) ;
233- this . dropdownButton . nativeElement . focus ( ) ;
234- if ( event . item && event . item . selected ) {
235- if ( this . value ) {
236- this . propagateChange ( event . item [ this . value ] ) ;
237- } else {
238- this . propagateChange ( event . item ) ;
239- }
222+ if ( ! this . view ) {
223+ return ;
224+ }
225+ this . view . type = this . type ;
226+ this . view . size = this . size ;
227+ this . view . select . subscribe ( event => {
228+ if ( this . type === "multi" ) {
229+ this . propagateChange ( this . view . getSelected ( ) ) ;
230+ } else {
231+ this . closeMenu ( ) ;
232+ this . dropdownButton . nativeElement . focus ( ) ;
233+ if ( event . item && event . item . selected ) {
234+ if ( this . value ) {
235+ this . propagateChange ( event . item [ this . value ] ) ;
240236 } else {
241- this . propagateChange ( null ) ;
237+ this . propagateChange ( event . item ) ;
242238 }
239+ } else {
240+ this . propagateChange ( null ) ;
243241 }
244- this . selected . emit ( event ) ;
245- } ) ;
246- }
242+ }
243+ this . selected . emit ( event ) ;
244+ } ) ;
247245 }
248246
249247 /**
@@ -342,19 +340,20 @@ export class Dropdown implements OnInit, AfterContentInit, OnDestroy {
342340 * Returns the display value if there is no selection, otherwise the selection will be returned.
343341 */
344342 getDisplayValue ( ) : Observable < string > {
345- if ( this . view ) {
346- let selected = this . view . getSelected ( ) ;
347- if ( selected && ! this . displayValue ) {
348- if ( this . type === "multi" ) {
349- return of ( `${ selected . length } ${ this . selectedLabel } ` ) ;
350- } else {
351- return of ( selected [ 0 ] . content ) ;
352- }
353- } else if ( selected ) {
354- return of ( this . displayValue ) ;
343+ if ( ! this . view ) {
344+ return ;
345+ }
346+ let selected = this . view . getSelected ( ) ;
347+ if ( selected && ! this . displayValue ) {
348+ if ( this . type === "multi" ) {
349+ return of ( `${ selected . length } ${ this . selectedLabel } ` ) ;
350+ } else {
351+ return of ( selected [ 0 ] . content ) ;
355352 }
356- return of ( this . placeholder ) ;
353+ } else if ( selected ) {
354+ return of ( this . displayValue ) ;
357355 }
356+ return of ( this . placeholder ) ;
358357 }
359358
360359 /**
0 commit comments