Javascript Angularjs多维数组和两个相对的选择框

我有一个多维数组，它保存产品名称和版本。 我想创建一个界面，让用户从选择框中选择产品，然后在第二个选择框中选择版本号。第二个选择框应仅显示用户在第一个选择框中选择的产品的版本号

这是我的多维数组：

[Object]0: 
         name: "Product 1"
         versions: [Array]0:
                           number: "1.0"
                           number: "1.5.2"
        1: 
         name: "Product 2"
         versions: [Array]0:
                           number: "0.0"
                           number: "0.5"

用户可以选择多个产品，所以我创建了一个数组来保存用户的选择

我的控制器设置如下：

app.controller('mainController', function ($scope) {

    $scope.products = [{id: 1, name: '', versions: []}];

  $scope.packages = [];
  $scope.packages[0] = { id: 1, name: 'Product 1', versions: [{number: 1.0}, {number: 1.5}, {number: 2.0}]};
  $scope.packages[1] = { id: 2, name: 'Product 2', versions: [{number: 0.1}, {number: 0.2}, {number: 0.3}]};

    $scope.addProduct = function(){
    var id = $scope.products.length + 1;
    $scope.products.push({id: id, name: "", version: []});

  };
});

angularjs的选择框设置如下：

    <div  ng-repeat="product in products">
       <label>Product</label>
       <select ng-model="product.product" ng-options="package.name for package in packages" class="form-control"></select>

       <label>Version</label>
       <select ng-model="product.versions" ng-options="version.number for version in product.versions" class="form-control"></select>
</div>
<button ng-click="addProduct()">Add Product</button>

产品
版本
添加产品

我试图做的是设置ng选项以选择当前产品的versions对象。但这不起作用

我创建了一个我目前拥有的JSFIDLE：

我真的很感激任何关于如何将版本选择框与所选产品链接的建议

---

TIA

尽管我没有真正了解每个产品选择的版本，但我修复了您的相对选择选项

---

您可以找到

解决方案

。这会让你上路的

我错过了一些非常简单的东西

在版本选择框中，我应该在product.product.versions中的版本使用

version.number绑定，而不是在product.versions中的版本使用
version.number绑定

下面是一个正在工作的JSFIDLE:
这是您正在尝试做的事情吗？这确实是版本号的问题。。。但我还是觉得你的代码有点奇怪。第一次ng重复可能会成为非常昂贵的渲染。。。您的表单封装在其中，因此每次添加时都必须呈现一个额外的表单，它必须在完全相同的包数组上迭代才能添加到第一个列表中。