Tell me, please, how to redefine the angular2 pattern. There is a select box module ng2-select. In this module, you need to change the template: add a custom scrollbar (ng2-slimscroll), slightly change the layout. The question is how to implement this in angular2? Now the component looks like this:

import { Component } from '@angular/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from '@angular/common'; import {BUTTON_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; import {SELECT_DIRECTIVES } from 'ng2-select/ng2-select'; import {BaseComponent} from '../base/base.component'; @Component({ selector: 'content', templateUrl: 'app/admin/generation/generation.component.html', directives: [SELECT_DIRECTIVES], styleUrls: ['../../node_modules/ng2-select/components/css/ng2-select.css'] }) export class GenerationComponent { public items:Array<string> = ['Amsterdam', 'Antwerp', 'Athens', 'Barcelona', 'Berlin', 'Birmingham', 'Bradford', 'Bremen', 'Brussels', 'Bucharest', 'Budapest', 'Cologne', 'Copenhagen', 'Dortmund', 'Dresden', 'Dublin', 'Düsseldorf', 'Essen', 'Frankfurt', 'Genoa', 'Glasgow', 'Gothenburg', 'Hamburg', 'Hannover', 'Helsinki', 'Kraków', 'Leeds', 'Leipzig', 'Lisbon', 'London', 'Madrid', 'Manchester', 'Marseille', 'Milan', 'Munich', 'Málaga', 'Naples', 'Palermo', 'Paris', 'Poznań', 'Prague', 'Riga', 'Rome', 'Rotterdam', 'Seville', 'Sheffield', 'Sofia', 'Stockholm', 'Stuttgart', 'The Hague', 'Turin', 'Valencia', 'Vienna', 'Vilnius', 'Warsaw', 'Wrocław', 'Zagreb', 'Zaragoza', 'Łódź']; private value:any = {}; private _disabledV:string = '0'; private disabled:boolean = false; private get disabledV():string { return this._disabledV; } private set disabledV(value:string) { this._disabledV = value; this.disabled = this._disabledV === '1'; } public selected(value:any):void { console.log('Selected value is: ', value); } public removed(value:any):void { console.log('Removed value is: ', value); } public typed(value:any):void { console.log('New search input: ', value); } public refreshValue(value:any):void { this.value = value; }

}

    1 answer 1

    This is not supported as standard, but there are decorators that allow you to override some of the fields of the parent decorator:

    @WjComponent decorator

    The answer: the @WjComponent decorator offered by the Wijmo for Angular 2 module. It is a standard design and it accepts all the elements of the design.

    http://wijmo.com/blog/using-class-inheritance-to-create-a-custom-component-in-angular-2/