Skip to content

Instantly share code, notes, and snippets.

🌴
On vacation

Kalpesh Shingala Kalpesh300

🌴
On vacation
Block or report user

Report or block Kalpesh300

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View demo.component.ts
import { Component, OnInit, Input } from '@angular/core';
import { Subject } from 'rxjs';
@Component({
selector: 'app-demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class Demo implements OnInit {
View demo.component.ts
import { Component, OnInit, Input } from '@angular/core';
import { Subject } from 'rxjs';
@Component({
selector: 'app-demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class Demo implements OnInit {
View demo.component.ts
import { Component, OnInit, Input } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { FormControl } from '@angular/forms';
@Component({
selector: 'app-demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class Demo implements OnInit {
View demo.component.ts
import { Component, OnInit, Input } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { FormControl } from '@angular/forms';
@Component({
selector: 'app-demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class Demo implements OnInit {
@Kalpesh300
Kalpesh300 / app.component.html
Created Dec 12, 2019
Custom Dropdown Control
View app.component.html
<app-custom-dropdown [formControl]="dropdownControl"></app-custom-dropdown>
View custom-dropdown.component.ts
import { Component, OnInit, forwardRef } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
@Component({
selector: 'app-custom-dropdown',
templateUrl: './custom-dropdown.component.html',
styleUrls: ['./custom-dropdown.component.scss'],
providers: [{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => CustomDropdownComponent),
View custom-dropdown.component.ts
export class CustomDropdownComponent implements OnInit,
ControlValueAccessor {
options: string[];
selectedOption: string;
onChange: (_: any) => {};
constructor() { }
View custom-dropdown.component.html
<div class="btn-group" dropdown>
<button id="button-basic" dropdownToggle type="button"
class="btn btn-primary dropdown-toggle"
aria-controls="dropdown-basic">
{{ selectedOption }} <span class="caret"></span>
</button>
<ul id="dropdown-basic" *dropdownMenu class="dropdown-menu"
role="menu" aria-labelledby="button-basic">
<li role="menuitem" *ngFor="let option of options
View custom-dropdown.component.ts
export class CustomDropdownComponent implements OnInit,
ControlValueAccessor {
options: string[];
selectedOption: string;
constructor() { }
ngOnInit() {
this.options = [
View app.component.html
<app-custom-dropdown [formControl]="dropdownControl"></app-custom-dropdown>
You can’t perform that action at this time.