получить параметры динамического выбора для выбора нескольких чисел в диапазоне от 0 до n в угловых js - PullRequest
Новая
       32

получить параметры динамического выбора для выбора нескольких чисел в диапазоне от 0 до n в угловых js

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

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

<input type="text" ng-model="range" placeholder="enter range">
<select multiple name="selectValue" id="selectValue" ng-model="selectValue" >
  <option value="i" ng-repeat="i in range">hi</option>
</select>

1 Ответ

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

Я бы просто взял два разных значения.Один для ng-model входа (rangeInput), а другой для ng-model списка выбора (selectValue).

Затем я могу прослушать нажатие enter, используяng-keyup="$event.which === 13 && vm.addToRange()"

В методе контроллера addToRange() я буду split вводить диапазон с -, reverse, чтобы получить максимальное число бросков, изменив его на тип numberдобавляя выражение к +.Вот что здесь происходит: 

const total = +this.rangeInput.split('-').reverse()[0];

Как только я получу общее количество, я могу сгенерировать range, используя Array fill метод, который сгенерирует для меня массив.Затем я сопоставлю входные данные, чтобы начать с 1, и увеличу следующий элемент на 1. Вот что делает следующая строка: 

this.range = Array(total).fill(1).map((x, y) => x + y);

Наконец, я могу сбросить ввод range на пустойстрока.

Шаблон: 

<input 
  type="text" 
  ng-model="vm.rangeInput" 
  placeholder="enter range"
  ng-keyup="$event.which === 13 && vm.addToRange()">

<br>
<br>

<select 
  class="width"
  ng-change="vm.selectValueChanged()"
  multiple 
  name="selectValue" 
  id="selectValue" 
  ng-model="vm.selectValue">
  <option ng-value="i" ng-repeat="i in vm.range">{{i}}</option>
</select>

Контроллер: 

class HomeCtrl {
  constructor($scope) {
    'ngInject';

    this.range = [];
    this.rangeInput = '';
    this.selectValue = '';

    this.addToRange = () => {
      const total = +this.rangeInput.split('-').reverse()[0];
      this.range = Array(total).fill(1).map((x, y) => x + y);
      this.rangeInput = '';
    }

    this.selectValueChanged = () => {
      console.log(this.selectValue);
    }

  }
}

export default HomeCtrl;

Вот Образец StackBlitz для вашей ссылки.

PS: Я предполагаю, что номера бросков начнутся с 1.

...