javascript - AngularJS 将一个选择选项映射到另一个选择选项

Question

我有 2 个选择选项，这些选项将从不同的源动态填充，但现在我使用静态对象作为示例。
我想将原始范围内 id1 的 volvo 映射到 mapme 范围内 id2 的 volvo。

因此，一旦页面加载，如果存在相似的字段名称，它们就会被映射。 到目前为止，它只是在选择时将原始范围中的 id1 映射到 mapme 范围中的 id1。

任何有关如何进行 Angular 映射的帮助将不胜感激。

    angular.module('myApp',[])
    .controller('myController',function($scope,$timeout){
    $scope.original=[{"id":"id1", "text":"volvo"}, {"id":"id2", "text":"toyota"}];
    $scope.mapme=[{"id":"id1", "text":"toyota"}, {"id":"id2", "text":"volvo"}];

    });

.

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

    original <select ng-model="model.id" ng-options="original.id as original.text for original in original" ></select> 

    {{model.id}} 

    <br>
     mapme  <select ng-model="model.id" ng-options="map.id as map.text for map in mapme" ></select> {{model.id}}  

    </div>

</div>

Answer 1

两个模态和一个 ng-change 函数如何进行映射，但您需要访问诸如 $scope.model.id 和 $ 这样的 ID范围.model2.id

var app = angular.module('myApp', []);

app.controller('MyController', function MyController($scope, $filter) {
$scope.model2 = "";
$scope.change = function(val){
	$scope.model2 = $filter('filter')($scope.mapme, { text: val.text })[0];
}
 $scope.original=[{"id":"id1", "text":"volvo"}, {"id":"id2", "text":"toyota"}];
    $scope.mapme=[{"id":"id1", "text":"toyota"}, {"id":"id2", "text":"volvo"}];
});    

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller='MyController' ng-app='myApp'>
original <select ng-model="model" ng-change="change(model)" ng-options="original as original.text for original in original" ></select> 

    {{model.id}} 

    <br>
     mapme  <select ng-model="model2" ng-options="map as map.text for map in mapme" ></select> {{model2.id}}  

</div>
javascript angularjs
shareeditflag
edited 41 secs ago

Lazar Ljubenović
2,3331025
asked 6 mins ago

user3548161
738
add a comment
Know someone who can answer? Share a link to this question via email, Google+, Twitter, or Facebook.
Your Answer


 

community wiki
Post Your Answer
Browse other questions tagged javascript angularjs or ask your own question.

asked

today

viewed

5 times

FEATURED ON META
Sunsetting Documentation
Documentation is read-only. What’s next?
HOT META POSTS
26 I need some help improving one of my old questions
4 Are the penalties for editing increased?
Looking for a job?
Senior Frontend Developer (Angular.js 1.x)
RecordsureLondon, UK
$18K - $30KREMOTE

</div>