Html 角5绑定

我是angular 5的新手，我正在做一项任务，根据行李和乘客的数量计算汽车的数量，因为每辆汽车都有特定的载客量。因此，用户输入这两个数字，然后我显示一个下拉菜单，用于选择车辆类型，如果所选类型的容量小于用户输入的行李或乘客，我将显示另一个下拉菜单…等，直到行李和乘客的车辆总容量等于或大于用户输入的容量。这是我的一个简短说明正在研究

问题是：如果用户选择了第一辆车，并且载客量小于输入的乘客和行李编号数据，则会显示另一个字段，但在我从下一个字段中选择另一辆车之前，该值不会出现在第一个字段中，然后我再次返回到第一个字段的选择值，我知道它已经在数组中，我已经知道了选中该选项，但该值未显示在“选择”框中

我试图实现的是在选择第二个或第三个值后，无论何时选择它，都会在第一个字段中显示该值，然后再次选择它

     printType2(){
// at the first time this function is executed the carsToBeAdd array only has one empty object
          let totalCapacityPassengers = 0;
          let totalCapacityBags = 0;
          console.log(this.carsToBeAdded);
          for(let i =0;i < this.carsToBeAdded.length; i++){
            if(!isNaN(Number(this.carsToBeAdded[i].NumberOfPassengers))  && !isNaN(Number(this.carsToBeAdded[i].NumberOfBags))){
            totalCapacityPassengers +=Number(this.carsToBeAdded[i].NumberOfPassengers);
            totalCapacityBags += Number(this.carsToBeAdded[i].NumberOfBags);
          }
          }  
          console.log(totalCapacityBags);
          console.log(totalCapacityPassengers);
        if((totalCapacityPassengers < this.booking.numOfPassengers || totalCapacityBags < this.booking.numOfBags)&& this.carsToBeAdded[this.carsToBeAdded.length-1].id){


            this.carsToBeAdded.push({});
          }
          else
          {
            console.log('You got the right number');
          }


        }

下面是component.Html部分

 <div class="form-group row" *ngFor="let x of carsToBeAdded;let i=index">
      <label class="col-2 col-form-label">Car #{{i+1}} Type</label>
      <div class="col-10">
          <select class="form-control" name="car_type_id" [(ngModel)]="carsToBeAdded[i]" (change)="printType2()" required>
            <option *ngFor = "let type of carTypes" [ngValue]="type">{{ type.model+' '+type.manufacturer }}</option>
          </select>

      </div>
    </div>   

这是我的全部组件，以防你想看一下：

---

我认为这里的问题是您的ngModel对象与您的ngValue对象不匹配，即ngModel是一个Car对象，而ngValue似乎是一个CarType。您应该将该类型添加到Car对象中，并使用该类型指示预期的内容

<div class="form-group row" *ngFor="let x of carsToBeAdded;let i=index">
    <label class="col-2 col-form-label">Car #{{i+1}} Type</label>
    <div class="col-10">
        <select class="form-control" name="car_type_id" [(ngModel)]="carsToBeAdded[i].type" (change)="printType2()" required>
            <option *ngFor="let type of carTypes" [ngValue]="type">{{ type.model+' '+type.manufacturer }}</option>
        </select>
    </div>
</div>

---

我可能会建议你把它扔进一个垃圾桶，这样人们就可以运行它来帮助你。你的问题很难回答confusing@SyntacticFructose我添加了它，这更有意义，谢谢！这不是我的意思，哈哈，你的问题有太多的文字，我可以向你保证，没有人会浏览700行代码来帮助你。你最好的办法是找出你的问题，并精简你的问题，分解出你想要的，你尝试过的，和不起作用的。你对所有这些我们没有背景的汽车信息都很感兴趣，试着把重点放在与安格拉索有关的具体问题上。我没明白你的意思哈哈！我试过了，但没用！谢谢你的努力