2016-11-12 5 views
0

По умолчанию, когда вы изменяете список источников, с которым привязан select, он удаляет выбранный элемент списка, даже если этот элемент существует полностью в новый список. Я полагаю, что может быть способ сказать угловым, что если у них одинаковое свойство WhateverKey, то рассмотрите их один и тот же элемент и не отмените выбор. Есть ли способ сделать это?Угловой: как повторно привязываться к ранее выбранному объекту при изменении списка

В приведенном ниже примере новый пользователь повторно связывает (думает: перегружает) список возможных местоположений, но выбранное место ($scope.Location) все еще существует в новом списке, и, таким образом, интуиция пользователя говорит об этом должен быть выбран.

Я понимаю, что проблема в том, что это буквально другой ссылочный объект с другим угловым ключом объекта. Я спрашиваю, как автоматически перестроить на основе свойства объекта (в данном случае LocationKey), не прибегая к циклизации через JavaScript, чтобы вручную найти соответствующий объект в новом списке.

function Ctrl($scope) { 
 
    $scope.Customers = [{CustomerKey: 1, CustomerCode: 'Customer1'}, 
 
         {CustomerKey: 2, CustomerCode: 'Customer2'}, 
 
         {CustomerKey: 3, CustomerCode: 'Customer3'}]; 
 
    $scope.Locations = [{LocationKey: 1, LocationCode: 'Location1'}, 
 
         {LocationKey: 2, LocationCode: 'Location2'}, 
 
         {LocationKey: 3, LocationCode: 'Location3'}]; 
 
    $scope.Customer = $scope.Customers[0]; 
 
    $scope.Location = $scope.Locations[0]; 
 
         
 
    $scope.SelectCustomer = function() { 
 
    $scope.Locations = angular.copy($scope.Locations); 
 
    } 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app ng-controller="Ctrl"> 
 
    <select ng-model="Customer" 
 
      ng-options="c as c.CustomerCode for c in Customers" 
 
      ng-change="SelectCustomer()"></select> 
 
    <select ng-model="Location" 
 
      ng-options="l as l.LocationCode for l in Locations"></select> 
 
    <div ng-bind="'Customer: ' + Customer.CustomerCode"></div> 
 
    <div ng-bind="'Location: ' + Location.LocationCode"></div> 
 
</div>

ответ

0
$scope.SelectCustomer = function() { 

    $scope.Locations = angular.copy($scope.Locations); 
    $scope.Location = $scope.Locations.find(function(loc){ 
    return loc.LocationKey === $scope.LocationKey; 
    } 
} 

Извините за ленивый ответ. Был бы комментарий, если бы вы могли правильно форматировать код в комментарии.

+0

Это не работает. Вы подразумеваете, что «LocationKey» равен индексу, что здесь неверно (оно выключено на 1) и определенно не будет истинным в живой среде, где ключи являются произвольными числами. –

+0

О, вы правы, конечно. Обновлен с ответом ES6. Конечно, это также не «не прибегая к циклическому переходу через JavaScript, чтобы найти соответствующий объект в новом списке вручную». – ippi