Question

我在单击包含ng-repeat的表单的提交按钮和ng-options生成的选择时尝试获取所选值。但是我无法达到所选值，请您查看我的代码并告诉我我错过了什么？

<form class="form-horizontal">
<!-- Options -->
<div class="product-page-options">
    <div class="form-group clearfix" ng-repeat="option in product.options.data">
        <label class="col-md-4 control-label pull-left">{{ option.name }}</label>
        <div class="col-md-8">
            <select class="form-control" ng-options="value.name for value in option.values.data" ng-model="selectedValue">
                <option value="">Select {{ option.name }}</option>
            </select>
        </div>
    </div>
</div>

<!-- Add to cart -->
<div class="product-page-cart">
<div class="product-quantity">
  <input type="number" value="1" class="form-control input-sm">
</div>
<button class="btn btn-primary" type="submit" ng-click="add(selectedValue)">Add to cart</button>

我试图通过将

{{ selectedValue }}

置于ng-repeat div中来打印所选值，并且它按预期完美显示，但是如果我尝试将其放在div之外，则不会打印出任何内容。

我用来构建表单的json数据http://pastebin.com/nah3Pt5r

//编辑：

我只是用Google搜索并发现了一个像我这样的小提琴：http://jsfiddle.net/DrQ77/所以我决定将ng-model修改为选中的[option.name]，但$ scope.selected仍显示未定义。

//编辑2：好的，通过在控制器中添加

$scope.selected = {};

来解决问题。

感谢您的时间！

Answer 1

您的ng-options有一个孤立的范围。因此selectedValue内部是已知的，但不在其中（正如您在问题中所述）。

在您的父作用域上定义一个变量，并将其分配给ng-model的{{1}}，并且您应该能够在ng-options之外访问该变量。

如何在表单中获取ng-repeat内的ng-options的选定值

1 个答案: