Иерархический выбор с использованием Aurelia

Я пишу мобильное приложение с использованием Aurelia (Cordova, Typcript, HTML5, & Bootstrap), и мне нужно сделать иерархический выбор, когда выбор из одного списка SELECT фильтрует параметры в следующем списке SELECT. Кто-нибудь знает, как это сделать в Аурелии? Мой код со связями приведен ниже. Список в selRatedItems необходимо фильтровать по тому, что выбрано в selCategories. Спасибо за любую помощь.Иерархический выбор с использованием Aurelia

   <div class="row"> 
        <div class="form-group form-group-sm"> 
         <label for="selCategory" class="col-sm-2 control-label">Category</label> 
         <div class="col-sm-10"> 
          <select class="form-control" id="selCategory" value.bind="selectedCategory" required> 
           <option value="">Select a category...</option> 
           <option repeat.for="option of categories" model.bind="option">${option.name}</option> 
          </select> 
         </div> 
        </div> 
       </div> 
       <div class="row"> 
        <div class="form-group form-group-sm"> 
         <label for="selRatedItem" class="col-sm-2 control-label">Rated Item</label> 
         <div class="col-sm-10"> 
          <select class="form-control" id="selRatedItem" value.bind="selectedItem" required> 
           <option value="">Select an item...</option> 
           <option repeat.for="option of selectedCategory.rateditems" model.bind="option.rateditems.id">${option.rateditems.name}</option> 
          </select> 
         </div> 
        </div> 
       </div>

источник

2016-05-10 cnotes

попытаться положить вместе бегущий образец того, что вы пытаетесь сделать, используя [Аурелий GIST] (https://gist.run/?id=7542e061bc940cde506b). Это облегчит людям помощь –

@JeremyDanyow - Спасибо за информацию, но я совершенно не знаком с Aurelia и понятия не имею, что это такое. Я проверю ссылку. Я буквально начал новую работу и был брошен в проект с использованием Aurelia. – cnotes

Вот как я решил эту ...

Во-первых, я должен был добавить вычисляемое свойство в модели представления, которая была основана прочь имущества, связанного списка selCategory SELECT, сверху.

оператор импорта Добавлен:

import { computedFrom } from 'aurelia-framework';

Добавлено свойство:

@computedFrom('selectedCategory') 
    get rateditems() { 
     if (this.selectedCategory && this.selectedCategory.rateditems) { 
      return Object.keys(this.selectedCategory.rateditems).map(key => this.selectedCategory.rateditems[<any>key]); 
     } 
     else { 
      var array: any[] = []; 
      return array; 
     } 
    }

Тогда я связала ВЫБЕРИТЕ список, который должен быть отфильтрован, в этом случае, selRatedItem, вычисленную собственность.

Недавно связанный ВЫБРАТЬ список:

    <div class="row"> 
         <div class="form-group form-group-sm"> 
          <label for="selRatedItem" class="col-sm-2 control-label">Rated Item</label> 
          <div class="col-sm-10"> 
           <select class="form-control" id="selRatedItem" value.bind="selectedItem" required> 
            <option value="">Select an item...</option> 
            <option repeat.for="item of rateditems" model.bind="item.id">${item.name}</option> 
           </select> 
          </div> 
         </div> 
        </div>

источник

2016-05-10 18:31:31 cnotes

Иерархический выбор с использованием Aurelia

ответ

Смежные вопросы