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>