Угловая итерация через вложенную форму для получения значений - PullRequest
Новая
       9

Угловая итерация через вложенную форму для получения значений

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

Я использую угловой 5.x.У меня есть эти данные JSON я строю форму (HTML).Мне нужно перебрать элементы формы 

{
"_id": "TTP93E5014288850",
"productId": 10353,
"updatedAt": "2018-10-01T12:49:37.197Z",
"createdAt": "2018-05-22T06:50:29.904Z",
"name": "Le Petit-déjeuner \"Parisien\"i6060",
"arName": "فطور باريسي",
"cost": 14.66,
"category": "Breakfast packages",
"arCategory": "لائحة الفطور",
"storeCode": "dev",
"ownerId": 300200,
"prodDescription": "",
"arProdDescription": "",
"sortIndex": 57,
"url": "http://tmmmt.com/dev/TTP93E5014288850",
"__v": 0,
"offerCost": 0,
"isVatIncluded": false,
"subType": "default",
"meals": {
"packages": [],
"isMandatory": true,
"types": []
},
"isDeleted": false,
"isVerified": true,
"isTimeBased": false,
"options": [
  {
    "option": "one hot beverage of your choice",
    "arOption": " إختيارك من المشروبات الساخنة",
    "_id": "5b03bdb533e27e3a4f318acf",
    "isMandatory": true,
    "isMulti": false,
    "values": [
     {
      "value": "Cappuccino",
      "arValue": "كابوتشينو",
      "price": 0,
      "_id": "5b03bdb533e27e3a4f318ada"
     },
     {
      "value": "Espresso",
       "arValue": "اسبرسو",
       "price": 0,
       "_id": "5b03bdb533e27e3a4f318ad9"
     },
     {
       "value": "Café crème",
       "arValue": "قهوة بالكريمه",
       "price": 0,
       "_id": "5b03bdb533e27e3a4f318ad8"
     },
     {
       "value": " American coffee",
       "arValue": "قهوة اميريكيه",
       "price": 0,
       "_id": "5b03bdb533e27e3a4f318ad7"
     },
     {
       "value": "PAUL hot chocolate",
       "arValue": "شوكولاته ساخنه",
       "price": 0,
       "_id": "5b03bdb533e27e3a4f318ad6"
    },
    {
      "value": " Flat white",
      "arValue": "فلات وايت",
      "price": 0,
      "_id": "5b03bdb533e27e3a4f318ad5"
    },
    {
      "value": "Marrocchino",
      "arValue": " ماروشينو",
      "price": 0,
      "_id": "5b03bdb533e27e3a4f318ad4"
    },
    {
      "value": "Cinnamon vanilla latté",
      "arValue": " سينامون فانيلا لاتيه",
      "price": 0,
      "_id": "5b03bdb533e27e3a4f318ad3"
   },
   {
      "value": "Caramel sticky mocha",
      "arValue": "كراميل ستيكي موكا",
      "price": 0,
     "_id": "5b03bdb533e27e3a4f318ad2"
    },
    {
      "value": " PAUL vanilla black tea",
      "arValue": "شاي بول أسود بالفانيلا",
      "price": 0,
      "_id": "5b03bdb533e27e3a4f318ad0"
    }
    ]
  },
  {
   "option": "one viennoiserie of your choice",
   "arOption": " إختيارك من الفيينوازري ",
   "_id": "5b03bdb533e27e3a4f318ac3",
   "isMandatory": true,
  "isMulti": false,
  "values": [
  {
    "value": "Croissant",
    "arValue": "كرواسان",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ace"
  },
  {
    "value": "Croissant au thym",
    "arValue": "كرواسان بالزعتر",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318acd"
  },
  {
    "value": " Croissant au fromage",
    "arValue": "كرواسان بالجبة",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318acc"
  },
  {
    "value": "Croissant aux amandes",
    "arValue": "كرواسان باللوز",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318acb"
  },
  {
    "value": " Croissant aux pistaches",
    "arValue": "كرواسان بالفستق",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318aca"
  },
  {
    "value": " Anglaise aux abricots",
    "arValue": " فطيرة كومبوت المشمش",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ac9"
  },
  {
    "value": " Gourmandise au chocolat",
    "arValue": "غورماديز الشكولاته",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ac8"
  },
  {
    "value": " Pain au chocolat",
    "arValue": "كرواسان الشكولاته",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ac7"
  },
  {
    "value": "Pain aux raisins",
    "arValue": "كعكة الزبيب",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ac6"
  },
  {
    "value": "Pain au chocolat et amandes",
    "arValue": "كرواسان الشكولاته واللوز",
    "price": 0,
    "_id": "5b03bdb533e27e3a4f318ac5"
   },
   {
     "value": " Pain au chocolat et pistaches",
     "arValue": " كرواسان الشكولاته والفستق",
     "price": 0,
     "_id": "5b03bdb533e27e3a4f318ac4"
    }
  ]
  }
 ],
 "linkType": "public",
 "pictures": [],
 "maxQuantity": 10,
 "payType": "any",
 "count": 50,
 "isAvailable": true,
 "vatPercentage": null,
 "vatCost": null,
 "baseCost": null,
 "owner": null,
 "isOffer": false,
 "isCostOffer": false,
 "isDeliveryOffer": false,
 "id": "TTP93E5014288850"
}

Если вы видите, что ключ options это массив, основанный внутри, у меня есть values, который также является массивом, однако я построил форму с этими данными.Теперь мне нужно перебрать элементы формы одних значений.Добавляю свой угловой код ниже. 

initProductForm(product?: PublicProduct) {
const isOffer = product && product.offer && product.offer.startAt ? true : false;

this.productForm = this.fb.group({
  storeCode: new FormControl(
    {
      value: product && product.storeCode ? product.storeCode : this.myStore._id,
      disabled: true,
    },
    [Validators.required, Validators.pattern(/\S(.*\S)?/)]
  ),
  ownerId: new FormControl(this.userPkid, Validators.required),
  name: new FormControl(product && product.name ? product.name : '', [
    Validators.required,
    Validators.pattern(/\S(.*\S)?/),
  ]),
  arName: new FormControl(product && product.arName ? product.arName : '', [
    Validators.required,
    Validators.pattern(/\S(.*\S)?/),
  ]),
  prodDescription: new FormControl(
    product && product.prodDescription ? product.prodDescription : '',
    Validators.pattern(/\S(.*\S)?/)
  ),
  arProdDescription: new FormControl(
    product && product.arProdDescription ? product.arProdDescription : '',
    Validators.pattern(/\S(.*\S)?/)
  ),
  isTimeBased: new FormControl(product && product.isTimeBased ? product.isTimeBased : false),
  startTime: new FormControl(
    product && product.menuStartTime
      ? {
          hour: moment(product.menuStartTime).hour(),
          minute: moment(product.menuStartTime).minute(),
        }
      : '',
    product && product.isTimeBased ? Validators.required : null
  ),
  endTime: new FormControl(
    product && product.menuEndTime
      ? {
          hour: moment(product.menuEndTime).hour(),
          minute: moment(product.menuEndTime).minute(),
        }
      : '',
    product && product.isTimeBased ? Validators.required : null
  ),
  menuStartTime: new FormControl(product && product.menuStartTime ? product.menuStartTime : ''),
  menuEndTime: new FormControl(product && product.menuEndTime ? product.menuEndTime : ''),
  cost: new FormControl(
    { value: product && product.cost ? product.cost : 0, disabled: isOffer },
    [Validators.required, Validators.min(0)]
  ),
  baseCost: new FormControl(
    {
      value:
        product && product.baseCost
          ? product.baseCost
          : this.calculateBaseAmount(
              product && product.cost ? product.cost : 0,
              (product && product.vatPercentage) || (product && product.vatPercentage == 0)
                ? product.vatPercentage
                : this.vatPercentage
            ),
      disabled: isOffer,
    },
    product && product.baseCost ? [(Validators.required, Validators.min(0))] : []
  ),
  category: new FormControl(product && product.category ? product.category : '', [
    Validators.required,
    Validators.pattern(/\S(.*\S)?/),
  ]),
  arCategory: new FormControl(product && product.arCategory ? product.arCategory : '', [
    Validators.required,
    Validators.pattern(/\S(.*\S)?/),
  ]),
  payType: new FormControl(
    product && product.payType ? product.payType : 'any',
    Validators.required
  ),
  imgFile: new FormControl(''),
  pictures: new FormControl(product && product.pictures ? product.pictures : ''),
  options: this.fb.array([]),
  isVatIncluded: new FormControl(product && product.vatPercentage ? true : false),
  vatPercentage: new FormControl(
    (product && product.vatPercentage) || (product && product.vatPercentage == 0)
      ? product.vatPercentage
      : this.vatPercentage
    // disabled: true,
  ),
});

}

Присоединяю отдельную группу форм к клавише опций 

initOption() {
return this.fb.group({
  option: new FormControl(''),
  isMulti: new FormControl(false),
  isMandatory: false,
  values: this.fb.array([]),
 });
}

initValue() {
 return this.fb.group({
   value: new FormControl(''),
   price: new FormControl(''),
 });
}

  addOption(option?): void {
(<FormArray>this.productForm.controls['options']).push(
  new FormGroup({
    option: new FormControl(option ? option.option : '', Validators.required),
    arOption: new FormControl(option ? option.arOption : '', Validators.required),
    isMulti: new FormControl(option ? option.isMulti : false),
    isMandatory: new FormControl(option ? option.isMandatory : false),
    values: this.fb.array([]),
  })
);

if (!option) {
  this.addValue((<FormArray>this.productForm.controls.options).length - 1);
 }
}

Теперь мой вопрос прост, все пытаюсьdo требуется перебрать форму значений, которая находится внутри формы параметров, которая находится внутри формы продукта.Является ли это возможным?.Я пытался так, но это не работает 

const syncBranchesControl = this.productForm.get('options');
(<FormArray>syncBranchesControl).controls.forEach((ctrl, index) => {
  console.log(ctrl);
});

Помните, что я уже создал форму, все, что мне нужно, это просто перебирать форму параметров.Любая помощь приветствуется

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

Похожие темы

...