Question

我的HTML是：

  <label> Size Scale:
  </label>

  <select ng-model="product.sizeScale"
    name="sizeScale"
    class="form-control"
    ng-options="value for (key, value) in sizeScaleCode.sizesType"
    ></select>

  <label> Size:
  </label>

  <select ng-model="product.size"

    name="size"
    class="form-control"
    ng-options="value for (key, value) in sizeScaleCode[product.sizeScale]"
    ></select>

$ scope.sizeScaleCode是这样的：

"sizeScaleCode":{
  "sizes_type" : {
    "0" : "IT",
    "1" : "FR"  
  },
  "IT" : {
    "0" : "54",
    "1" : "57",
    "2" : "Unica"
  },
  "FR" : {
    "0" : "54",
    "1" : "57",
    "2" : "Taille Unique"
  }

}

这个想法是，一旦自动选择尺寸比例，就会使用正确的值列表更新尺寸。此代码实际上在输入阶段有效。什么是无效的是当两个范围变量“product.sizeScale”和“product.size”（它们都是String）由一些现有值填充时我希望这两个选项预先填充该值。

有什么想法吗？

Answer 1

这对我有用。我发现的唯一错误是你在HTML中调用变量“sizesType”，在javascript中你称之为“sizes_type”。这是一个纠正的工作小提琴：

$scope.sizeScaleCode = {
  sizesType : { ...

http://jsfiddle.net/63ojssrc/

Answer 2

sizeScaleCode是一个对象，而不是一个数组。你将它用作大小的ng-options中的数组

ng-options="value for (key, value) in sizeScaleCode[product.sizeScale]"

您应该以与填充尺寸比例相同的方式填充它，即使用对象。

即使模型已预先初始化，AngularJs也不会更新html中的select

2 个答案: