给定下面的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以获得正确的值。

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


当前回答

AngularJS的Filter很适合我。

假设code/id是唯一的,我们可以用AngularJS的过滤器过滤掉特定的对象,并使用所选对象的属性。考虑上面的例子:

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

<!-- OUTSIDE THE SELECT BOX -->

<h1 ng-repeat="size in sizes | filter:search:true"
    ng-init="search.code = item.size.code">
  {{size.name}}
</h1>

这里有三个重要的方面:

ng-init = "搜索。Code = item.size。Code " -在选择框外初始化h1元素时,将筛选器查询设置为所选选项。 ng-change = "更新(MAGIC_THING);搜索。Code = item.size。Code”—当您更改选择输入时,我们将运行另一行,将“search”查询设置为当前选择的item.size.code。 filter:search:true -将true传递给过滤器以启用严格匹配。

就是这样。如果大小。code是uniqueID,我们将只有一个h1元素的文本为size.name。

我已经在我的项目中进行了测试,它是有效的。

祝你好运

其他回答

您需要使用“track by”,以便正确地比较对象。否则,Angular将使用原生js的方式来比较对象。

所以你的示例代码会变成-

    <select ng-options="size.code as size.name
 for size in sizes track by size.code" 
ng-model="item.size.code"></select>

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

http://plnkr.co/edit/B5TDQJ

<select ng-model="item.size.code">
<option ng-repeat="size in sizes" ng-attr-value="size.code">{{size.name}}          </option>
</select>

AngularJS的Filter很适合我。

假设code/id是唯一的,我们可以用AngularJS的过滤器过滤掉特定的对象,并使用所选对象的属性。考虑上面的例子:

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

<!-- OUTSIDE THE SELECT BOX -->

<h1 ng-repeat="size in sizes | filter:search:true"
    ng-init="search.code = item.size.code">
  {{size.name}}
</h1>

这里有三个重要的方面:

ng-init = "搜索。Code = item.size。Code " -在选择框外初始化h1元素时,将筛选器查询设置为所选选项。 ng-change = "更新(MAGIC_THING);搜索。Code = item.size。Code”—当您更改选择输入时,我们将运行另一行,将“search”查询设置为当前选择的item.size.code。 filter:search:true -将true传递给过滤器以启用严格匹配。

就是这样。如果大小。code是uniqueID,我们将只有一个h1元素的文本为size.name。

我已经在我的项目中进行了测试,它是有效的。

祝你好运

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

 <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);
}