AngularJS: выберите не двухстороннюю привязку к модели

Я использую select для отображения имен клиентов. Пользователь должен иметь возможность выбрать существующего клиента, который затем обновит свойство scope:

контроллер

Инициализация "первого выбора".

if($scope.clients.length > 0) $scope.existingClient = $scope.clients[0];

Просмотр

<select
    id='nm-existing-client-name'
    class='form-control  input-lg'
    ng-model='existingClient'
    ng-options="client.name for client in clients">
</select>

Свойство scope existingClient не изменяется при изменении меню выбора. Если значение не инициализировано (строка контроллера выше удалена), значение existingClient останется undefined.

Прикрепление ng-change будет срабатывать при изменении значения, но сама модель не будет обновляться до нового значения.

Я использую AngularJS v1.2.0-rc.3.

Ответ 1

Я думаю, что вы, вероятно, используете детскую область и не знаете этого. ng-if, ng-repeat, ng-switch и ng-include все создают дочерние области. Значения в области видимости наследуются, но если вы изменяете значение в дочерней области, оно устанавливает значение в области дочерних объектов и оставляет унаследованное значение неизменным на родительском. Попробуйте вместо этого использовать объект, чтобы сохранить ваши значения и посмотреть, исправляет ли он это. Поскольку вы только устанавливаете свойство объекта, а не значение непосредственно в области, оно будет использовать родительский объект, наследуемый объект, и обновить значение.

$scope.data = { existingClient: $scope.clients.length > 0 ? $scope.clients[0] : undefined };

Вид:

<select ng-model="data.existingClient" ng-options="client.name for client in clients"></select>

Вы можете использовать расширение AngularJS Batarang в хроме, чтобы помочь отладить ваши области.

Ответ 2

Это также решение сохранить параметры в объекте $scope:

контроллер:

$scope.scope = $scope;
$scope.clients = [];
$scope.existingClient = $scope.clients.length > 0 ? $scope.clients[0] : undefined;

Вид:

<select ng-model="scope.existingClient" ng-options="client.name for client in clients"></select>