如何与ngModel一起编写属性值

时间:2017-01-28 12:49:28

标签: angularjs

如何使用ngModel

添加一些额外的值

如果我有一个HTML

<select ng-model="forms.options" data-custom-select="">
<option value="value1" data-special-value="reference1">Value 1</option>
<option value="value2" data-special-value="reference2">Value 2</option>
<option value="value3" data-special-value="reference3">Value 3</option>
</select>

和自定义指令&#34; customSelect&#34;需要ngModel

我期待ngModel上的值

{value:<Selected Value>,reference:<data-special-value>}

这真的有可能吗?

1 个答案:

答案 0 :(得分:1)

您可以将object直接添加到ng-options,并将结果显示在所选模式中。

使用ng-options:

&#13;
&#13;
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

<select ng-model="selectedName" ng-options="option.value for option in options" ng-change="selected(option.reference)">
</select><br>
Selected Value: {{selectedName}}
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.options = [
{ value: 'value1', reference: 'reference1' },
{ value: 'value2', reference: 'reference2' },
{ value: 'value3', reference: 'reference3' }, 
]

});
</script>

<p>Select a value from dropdown.</p>

</body>
</html>
&#13;
&#13;
&#13;

请运行以上代码段

HERE IS A WORKING DEMO