Я могу отображать угловой selectbox, используя следующий JSON.
$scope.rejectionTypes = [
{
"code":"88",
"description":"Other reasons",
"type":{
"code":"PR",
"description":"Permoanent Rejection"
}
},
{
"code":"92",
"description":"Bank Excluded",
"type":{
"code":"OT",
"description":"Non Financial Transactions"
}
}
]
<select class="form-control" name="tranCode" data-ng-model="rowUnderEdit.rejectionReason" data-ng-change="populateRejectDesc(transactionType)">
<option data-ng-repeat="transactionType in rejectionTypes" ng-selected="compareSelect(transactionType, rowUnderEdit.rejectionReason)" >{{transactionType.code}}-{{transactionType.description}}</option>
</select>
Проблема в том, что всякий раз, когда изменяется параметр, нужно получить весь объект из "transactionType" (то есть код, описание и тип). Есть ли способ получить весь объект.
{
"code":"88",
"description":"Other reasons",
"type":{
"code":"PR",
"description":"Permoanent Rejection"
}
}
Я пытаюсь получить его следующим образом, но он бросает: ' transactionType undefined '
data-ng-change="populateRejectDesc(transactionType)"
<select>
предназначен для использования с ng-options
.
Подготовьте label
в объектах
$scope.rejectionTypes.map(function(item){
item.label = item.code + '-' + item.description;
});
и отображать их так
<select ng-options="item as item.label for item in rejectionTypes" ng-model="selected">
Выбранная переменная, selected
в ng-model
будет контролировать выбранный элемент. Вы можете назначить его в контроллере ($scope.selected = $scope.rejectionTypes[0]
) и прочитать его значение после его изменения в пользовательском интерфейсе
Plunker
То же самое, что вы хотите, я выполнил с помощью ng-options, потому что, когда вы используете ng-repeat с <option>
тогда ng-model из <select>
будет содержать значение "string".
HTML:
<div ng-app='myApp' ng-controller='myCtrl'>
<select class="form-control" name="tranCode" data-ng-model="rowUnderEdit.rejectionReason" data-ng-change="populateRejectDesc(rowUnderEdit.rejectionReason)" data-ng-options="check(transactionType) for transactionType in rejectionTypes">
</select>
</div>
Angularjs:
var app= angular.module('myApp',[]);
app.controller('myCtrl',function($scope){
$scope.rejectionTypes = [
{
"code":"88",
"description":"Other reasons",
"type":{
"code":"PR",
"description":"Permoanent Rejection"
}
},
{
"code":"92",
"description":"Bank Excluded",
"type":{
"code":"OT",
"description":"Non Financial Transactions"
}
}
];
$scope.compareSelect=function(transactionType, rejectionReason){
// $scope.selectedObject=transactionType;
console.log(rejectionReason);
};
$scope.populateRejectDesc=function(transactionType){
console.log('Object',transactionType);//your object
}
$scope.check=function(object){
return object.code+'-'+object.description;
}
});
Скрипт для решения: http://jsfiddle.net/y4dy1uqu/4/