给定下面的select元素

<select ng-options="size.code as size.name for size in sizes " 
        ng-model="item.size.code" 
        ng-change="update(MAGIC_THING)">
</select>

是否有一种方法可以让MAGIC_THING等于当前选择的大小,这样我就可以访问size.name和size。控制器中的代码?

大小。代码会影响应用程序的许多其他部分(图像url等),但当item.size.code的ng-model更新时,item.size.name也需要更新面向用户的东西。我假设做到这一点的正确方法是捕获更改事件并在控制器中设置值,但我不确定我可以将什么传递到update以获得正确的值。

如果这是完全错误的方法,我很想知道正确的方法。


当前回答

/ / Javascript 美元的范围。Update = function () { scope.myItem美元; alert('你好'); } <!——HTML > < div class = "形式的班级”> <选择name = "名称" id = " id " ng-model = " myItem " Ng-options ="size = size.name for size in sizes" 类= "表单控件" ng-change = " update () " 多个 要求> < /选择> < / div >

İf你想写,名字,id,类,多个,必需,你可以这样写。

其他回答

如果Divyesh Rupawala的答案不起作用(将当前项作为参数传递),那么请参阅这个Plunker中的onChanged()函数。它使用这个:

http://plnkr.co/edit/B5TDQJ

这是从angular选择选项列表中获取值的最简洁的方法(除了Id或Text)。 假设你的页面上有一个这样的产品选择:

<select ng-model="data.ProductId"
        ng-options="product.Id as product.Name for product in productsList"
        ng-change="onSelectChange()">
</select>

然后在你的控制器中像这样设置回调函数:

    $scope.onSelectChange = function () {
        var filteredData = $scope.productsList.filter(function (response) {
            return response.Id === $scope.data.ProductId;
        })
        console.log(filteredData[0].ProductColor);
    }

简单解释:因为ng-change事件不识别选择中的选项项,我们使用ngModel从控制器中加载的选项列表中过滤出所选的项。

此外,由于事件是在ngModel真正更新之前触发的,你可能会得到不希望看到的结果,所以一个更好的方法是添加一个超时:

        $scope.onSelectChange = function () {
            $timeout(function () {
            var filteredData = $scope.productsList.filter(function (response) {
                return response.Id === $scope.data.ProductId;
            })
            console.log(filteredData[0].ProductColor);
            }, 100);
        };

您也可以使用以下代码直接获取所选值

 <select ng-options='t.name for t in templates'
                  ng-change='selectedTemplate(t.url)'></select>

script.js

 $scope.selectedTemplate = function(pTemplate) {
    //Your logic
    alert('Template Url is : '+pTemplate);
}

而不是将ng-model设置为item.size。代码,如何设置它的大小:

<select ng-options="size as size.name for size in sizes" 
   ng-model="item" ng-change="update()"></select>

然后在你的update()方法中,$scope。项将被设置为当前选定的项。

以及任何需要item。size的代码。Code,可以通过$scope.item.code获得该属性。

小提琴。

根据评论中的更多信息更新:

为你的select ng-model使用一些其他的$scope属性,然后:

<select ng-options="size as size.name for size in sizes" 
   ng-model="selectedItem" ng-change="update()"></select>

控制器:

$scope.update = function() {
   $scope.item.size.code = $scope.selectedItem.code
   // use $scope.selectedItem.code and $scope.selectedItem.name here
   // for other stuff ...
}

你也可以试试这个:

<select  ng-model="selectedItem" ng-change="update()">
   <option ng-repeat="item in items" 
         ng-selected="selectedItem == item.Id" value="{{item.Id}}">
      {{item.Name}}
   </option>
</select>