Angular 2 + сброс библиотеки компонентов управления - PullRequest
Новая
       27

Angular 2 + сброс библиотеки компонентов управления

0 голосов
/ 26 октября 2018

Я создал библиотеку угловых компонентов, которую я устанавливаю через npm в мои приложения.

У меня есть выпадающий список, который заполняется и используется нормально ... проблема возникает, когда я хочу "сбросить" элементы управления библиотеки компонентов, чтобы сделать новый выбор.
Я не уверен, как это сделать?

Это HTML-код моей библиотеки компонентов для элемента управления раскрывающимся списком .. 

  <select [(ngModel)]='thisControl' name="nameControl" id="idControl" 
      (ngModelChange)="updateControl(thisControl)" class="form-control">
      <option *ngFor="let control of controls" [value]="control.ControlID"> 
      {{control.controlName}} ({{control.ControlCode}})</option>
  </select>

Это мой код компонента ... 

import { Component, OnInit, Output, EventEmitter, Input } from 
'@angular/core';
import { msControlDataService } from '../../services/ms-control-data- 
service';

@Component({
  selector: 'ms-control-name-id-code',
  templateUrl: './control-name-id-code.component.html',
  styleUrls: ['./control-name-id-code.component.scss']
})
export class ControlNameIdCodeComponent implements OnInit {
  agencies: any;
  constructor(private msControlDataService:msControlDataService) { }

  ngOnInit() {
    this.getAgencies();
  }
  @Input() currYear: any;
  @Output() selectedValue = new EventEmitter<object>();
  getAgencies(){
    this.msControlDataService.getControlListAD(this.currYear)
    .subscribe((data) => {
      this.agencies = data;

    });
  }
  updateControl(control){    
    this.selectedValue.emit(control);
  }
  thisControl:string = "";

}

Это мое использование в моем приложении ...

Я импортирую Модуль в app.module.ts и добавить мой тег в HTML ... 

 <ms-control-name-id-code [(currYear)]="currYear"  
(selectedValue)="setControl($event)" ></ms-control-name-id-code>

Как я уже сказал, все это работает, как и ожидалось, однако я не могу понять, как «сбросить» элемент управления без полного обновления страницы или получить ngModel элемента управления.

любая помощь приветствуется !!

1 Ответ

0 голосов
/ 29 октября 2018

В итоге я использовал @ViewChild, чтобы получить доступ ко всем свойствам и функциям моих компонентов ... 

@ViewChild(ControlNameIdCodeComponent)
private resetDropDown: ControlNameIdCodeComponent;

Тогда я могу просто изменить значение, привязанное к ngModel 

this.resetDropDown.thisControl = "";
...