角4 forEach（）on component.ts

Question

私のコンポーネントの1つにオブジェクトを含む配列を定義しましたが、合計を計算したいのですが、重複する識別子 'rowData'を指定するとエラーが発生します。 可能であれば誰でも私にforeachの使い方を教えてもらえますか、それが可能であっても？私はcliで作成された角度4を使用しています。コンポーネントの

完全なコードは、エラーを得た理由のコンストラクタの前にここに

import { Component, OnInit } from '@angular/core'; 
import { FormBuilder, Validators } from '@angular/forms'; 
import { Router, ActivatedRoute } from '@angular/router'; 
import { Http } from '@angular/http'; 
import { MdSnackBar } from '@angular/material'; 
import { SlimLoadingBarService } from 'ng2-slim-loading-bar'; 
import { LaravelService } from './../laravel.service'; 

@Component({ 
    selector: 'app-single-estimate-section', 
    templateUrl: './single-estimate-section.component.html', 
    styleUrls: ['./single-estimate-section.component.css'] 
}) 
export class SingleEstimateSectionComponent implements OnInit { 

    section: any = []; 
    estimate_id: number; 
    section_id: number; 
    laravelResponse: any; 
    submitButton = false; 
    buttonClicked: string; 

    material_sub_total: number = 0; 
    labour_sub_total: number = 0; 

    rowData: Array<Object> = [{ 
    'title': 'Product' as string, 
    'qty': null as number, 
    'material_margin': null as number, 
    'material_unit_rate': null as number, 
    'labour_unit_rate': null as number 
    }]; 


    rowData.forEach(item => { 
    this.material_sub_total = this.material_sub_total + item.material_unit_rate * item.qty + (item.material_margin/100 * item.material_unit_rate * item.qty); 
    }); 


    public postForm = this.formBuilder.group({ 
    'title': '', 
    'qty': '', 
    'material_margin': '', 
    'material_unit_rate': '', 
    'labour_unit_rate': '' 
    }); 

    onButtonClick(event: string) { 
    this.buttonClicked = event; 
    } 

    onAddNewClick() { 
    this.rowData.push({ 
     'title': '' as string, 
     'qty': null as number, 
     'material_margin': null as number, 
     'material_unit_rate': null as number, 
     'labour_unit_rate': null as number 
    }); 
    } 

    onRemoveRowClick(i: number) { 
    this.rowData.splice(i, 1); 
    } 

    onSubmit(data) { 
    let formData = this.postForm.value; 
    this.laravel.post_request('/edit-estimate-section/' + this.estimate_id + '/' + this.section_id, formData).subscribe(
     (data) => { 
     this.laravelResponse = data.json(); 

     if (this.laravelResponse.status == 1) { 
      this.snackBar.open(this.laravelResponse.message, 'OK', { duration: 3000 }); 
      if (this.buttonClicked == 'update-continue') { 
      this.router.navigateByUrl('/estimates/' + this.estimate_id + '/edit-section/' + this.section_id); 
      } else { 
      this.router.navigateByUrl('/estimates/' + this.estimate_id); 
      } 
     } else { 
      this.snackBar.open(this.laravelResponse.message, 'OK', { duration: 6000 }); 
     } 

     } 
    ); 
    } 

    constructor(
    private router: Router, 
    private activatedRoute: ActivatedRoute, 
    private http: Http, 
    private formBuilder: FormBuilder, 
    private laravel: LaravelService, 
    private snackBar: MdSnackBar, 
    private slimLoadingBarService: SlimLoadingBarService 
) { } 

    ngOnInit() { 

    this.slimLoadingBarService.start(); 

    this.activatedRoute.params.subscribe(
     (params) => { 
     this.estimate_id = params.id; 
     this.section_id = params.section_id; 
     } 
    ); 

    this.laravel.get_request('/get-estimate-section/' + this.estimate_id + '/' + this.section_id).subscribe(
     (data) => { 
     this.laravelResponse = data.json(); 

     if (this.laravelResponse.status == 1) { 
      this.section = this.laravelResponse.data; 

      this.postForm = this.formBuilder.group({ 
      }); 

     } else { 
      this.snackBar.open(this.laravelResponse.message, 'OK', { duration: 6000 }); 
      this.router.navigateByUrl('/404'); 
     } 
     this.slimLoadingBarService.complete(); 

     } 
    ); 

    } 

} 

Answer 1

あなたはforeachのをしようとして行きます。

あなたのforeachはそうすべきです。このthis.countSubtotal(); wriet int onNgInitメソッド（）;

countSubtotal(){ 
    this.rowData.forEach(item => { 
     this.material_sub_total = this.material_sub_total + item.material_unit_rate * item.qty + (item.material_margin/100 * item.material_unit_rate * item.qty); 
     }); 
} 

あなたはrowdataにデータを格納していますがrowDataに格納するデータの後​​を呼び出す必要があるとき、私は理解できません。

onAddNewClick() { 
    this.rowData.push({ 
     'title': '' as string, 
     'qty': null as number, 
     'material_margin': null as number, 
     'material_unit_rate': null as number, 
     'labour_unit_rate': null as number 
    }); 
    this.material_sub_total = 0; 
    this.countSubtotal(); 
    } 

Answer 2

ランダムなJS文をクラスの途中に置くことはできません。クラスにはプロパティ定義とメソッドが含まれています。コードはメソッドに入ります。クラス内のランダムなJS文はどういう意味ですか？それはいつ実行されますか？誰がそれを呼ぶだろうか？

calcMaterialSubtotalなどのメソッドの中にrowData.forEachを入れて、どこから呼び出すかを呼び出します。