Angular 7 / Ionic 4 Выберите выбранный вариант - PullRequest
0 голосов
/ 29 июня 2019

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

Цикл изменяется от 3 до 5 или даже больше на основе данных API.

Теперь я хочу узнать, какое из этих значений выбрал пользователь, и отправить их.В настоящее время моя кнопка «купить сейчас» ничего не делает.Я пробовал много способов, но мне не повезло.Может кто-нибудь разобраться, пожалуйста?

Когда мы нажимаем на кнопку магазина, значения / идентификаторы выбранных товаров должны быть напечатаны в консоли.

Снимок экрана прилагается для справки, заранее спасибо.

enter image description here enter image description here

      <ion-card>
        <div *ngFor="let item of currentItem.DealRuleDealCode; let i = index">
          <div *ngFor="let CT of item.CategoryType; let j = index ">
            <ion-grid>
              <ion-row padding-left padding-right>
                <ion-col size="6" no-padding>
                    <ion-label class="catName">{{CT.CategoryName}}: </ion-label>
                </ion-col>
                <ion-col>
                  **<ion-select ok-text="Okay" cancel-text="Dismiss" no-padding class="select" (ionChange)="selectChangeHandler($event)" >
                    <ion-item *ngFor="let SC of CT.SubCategory; let k = index" >
                      <ion-select-option [value]="SC.SubCategoryCode" selected >{{SC.SubCategoryName}} </ion-select-option>
                    </ion-item>
                  </ion-select>**      
                </ion-col>
              </ion-row>
            </ion-grid>
          </div>
        </div>
        <ion-grid>
          <hr />
          <ion-row>

              <ion-col size="6" no-padding>
                <ion-button fill="solid" color="light"  expand="full" size="">
                  <label class="bold"> {{currentItem.Price | currency : 'PKR'}} </label> 
                </ion-button>
              </ion-col>
              <ion-col size="6" no-padding>
                <ion-button fill="solid" color="light" (click)="shopNow()" expand="full" size="" class="bold">
                  <label> Shop </label>  
                  <ion-icon name="add-circle" slot="end" >ADD</ion-icon>
                </ion-button>
              </ion-col>
          </ion-row>
        </ion-grid>

      </ion-card>

Этомоя функция shopNow ().

Я просто хочу получить все выбранные значения в моей функции this shopNow ().Но я не знаю, как ....?

shopNow(){

}

Вот мой файл TypeScript

import { Component, OnInit, Pipe, PipeTransform, Input } from '@angular/core';
import {Validators, FormBuilder, FormGroup, FormArray  } from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { ProductsService } from '../services/products.service';
import { Router } from '@angular/router';

@Component({
  selector: 'app-menu-detail',
  templateUrl: './menu-detail.page.html',
  styleUrls: ['./menu-detail.page.scss'],
})

export class MenuDetailPage implements OnInit {

  currentItem:[];

  selectedValues:[] = [];
  //selectedItems = [];

  constructor(private productService: ProductsService, private router: Router, private formBuilder: FormBuilder) { }

  ngOnInit() {
    this.currentItem = this.productService.currentItem;

    if(this.currentItem.length < 1){
      this.router.navigate(['main/menu'])
    }
  }


  selectChangeHandler(event){
    console.log(event.target.value) 
  }

  shopNow(){

  }
}

1 Ответ

0 голосов
/ 29 июня 2019

Значение вашего выбора находится в value:

<ion-select [value]="selectvalues[j]" ok-text="Okay" cancel-text="Dismiss" no-padding class="select" (ionChange)="selectChangeHandler($event)">

Вы должны понимать, что вы строите систему двустороннего связывания Angular.

Это не случай представления информации и последующего ее сбора.

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

В вашем коде вам нужен массив, как я предложил selectvalues ​​[], который может содержать данные.Что-то вроде:

public selectvalues: any[] = [];

Я не уверен, насколько это возможно, достаточно ли этого, или вам придется вставлять пустые элементы в массив (чтобы соответствовать количеству item.CategoryTypeвы показываете).Вам придется поэкспериментировать с этим.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...