2017-09-13 7 views
1

関数を使用してngStyleに設定するコンポーネントがあります。オーバーフロー-yを除くすべてのスタイルで動作しますが、実際にそれ自体がうまく設定されているかどうかはわかりません。Angular2を使用してngStyleを設定する

onChangeFilterClientes(obj:any):any[]{   
    return this.clientes.filter(c => c.Nombre.toString().toLowerCase().indexOf(obj.query)>-1);   

    } 

私のコンポーネントの機能:

interface IOpcionesListaAutocomplete { 
    width: number; 
    height: number; 
    isOverflowY: boolean; 
} 

export class OpcionesListaAutocomplete implements IOpcionesListaAutocomplete { 
    width: number; 
    height: number; 
    isOverflowY: boolean; 
    constructor() { } 
} 

@Input() 
opcionesLista: IOpcionesListaAutocomplete = { 
    width: 550, 
    height: 150, 
    isOverflowY: true 
}; 


addStylesLista(){ 
    let styles= { 
     'heigth.px':this.opcionesLista.height, 
     'width.px':this.opcionesLista.width, 
     'overflow-y': this.opcionesLista.isOverflowY? 'auto': 'hidden' 
    }; 
    return styles; 
} 

すべてのスタイルは、オーバーフローを除いて、[OK]を動作します。

答えて

0

疑問符と変数の間にスペースを入れてください。 @ Legmanの答えに加えて

'overflow-y': this.opcionesLista.isOverflowY ? 'auto': 'hidden' 
0

、(質問で、それは'heigth.px'ある)'height.px'ためaddStylesLista()方法で別のタイプミスに気づきました。

0

おそらく他の場所のスタイル指定のためにオーバーライドされていますか?それに!importantを追加してみてください:

'overflow-y': (this.opcionesLista.isOverflowY? 'auto': 'hidden') + ' !important' 
関連する問題