Можно ли удалить или отключить или скрыть опцию выпадающего выбора атрибута в angular4 - PullRequest
Новая
       34

Можно ли удалить или отключить или скрыть опцию выпадающего выбора атрибута в angular4

0 голосов
/ 18 мая 2018

Я написал свой код на angular4 и хочу скрыть или отключить повторяющуюся опцию, которая появляется в выпадающем списке.Пожалуйста, дайте мне знать, как можно это скрыть.

Я пытался реализовать коды из -

Как удалить дублирующиеся выпадающие элементы с одинаковым значением

enter image description here

assign.component.ts 

  import * as $ from 'jquery';
  import { JQuery } from 'jquery';


   export class AssignComponent implements OnInit {

   seen = {};

  getRolesList() {
   var url = config.url;
   var port = config.port;
    this.http.post("http:....
   .map(result => this.rolesList = result.json())
   .subscribe((res: Response) => {


 JQuery('.updateMappingUserRole').children().each(function() {
  var txt = JQuery(this).attr('value');
  if (this.seen[txt]) {
      JQuery(this).remove();
  } else {
      this.seen[txt] = true;
  }
  });

  }

assign.component.ts 

    <div class="col-md-6">
          <div class="form-group">
            <label for="role"> Role: </label>
            <select class="form-control" name="updateMappingUserRole"

    [formControl]=
     "updateMappingRoleForm.controls['updateMappingUserRole']"
            [(ngModel)]="updateMappingUserRole" 
      (change)="getRoleID(updateMappingUserRole)" id="role">
            <option  > {{updateMappingUserRole}}</option>
              <option  *ngFor="let i of rolesList">{{i.ROLE_CD}} 
              </option>

              </select>
          </div>
        </div>
      </div>

1 Ответ

0 голосов
/ 18 мая 2018 
.map(result => this.removeDuplicates(result.json(), this.rolesList));

removeDuplicates(json: any[], destination: any[]) {
  destination = json.reduce((p, n) => {
    // If role already in array, don't push
    if (!p.includes(n)) { p.push(n); }
    return p;
  }, []);
}

Эта функция преобразует ваш массив, возвращаемый при вызове HTTP, с помощью функции reduce.

РЕДАКТИРОВАТЬ: Как работает reduce ( документация )

Для новичков в Javascript или тех, кто не знает функцию reduce:

reduce - это функция, которая будет перебирать массив и преобразовывать его.Его подпись 

reduce(callback(previousElement, nextElement, currentIndex, arr), startingValue);

Давайте рассмотрим пример: преобразуем массив чисел в их квадратные значения.

const initial = [1, 2, 3, 4];
const transformed = initial.reduce((p, n) => {
  p.push(n * n);
  return p;
}, []); // Will give [1, 4, 9, 16]

Теперь давайте разберем его:

На первой итерации мы находимся на первом элементе массива: 1.

Начальное значение, данноеreduce функция - пустой массив.
При обратном вызове это даст 

p = [], n = 1

Итак, мы помещаем квадратное значение 1 в массив, а затем возвращаем массив (обязательно).

Приходит следующая итерация: значения обратного вызова: 

p = [1], n = 2

Мы делаем тот же процесс, и на третьей и четвертой итерациях у нас будет это 

3 : p = [1, 4], n = 3
4 : p = [1, 4, 9], n = 4

Когда функция завершена (nextElement больше не имеет значения для принятия), она возвращает последнее значение previousElement, которое является преобразованным массивом.

...