基于角度对象的值的预设下拉列表
问题描述:
我有一个下拉列表,其中用户选择三个选项之一。基于它们的选择,控制器会触发一个函数,设置事件对象的两个属性的值。基于角度对象的值的预设下拉列表
这是下拉:
<select type="text" id="private_gallery" class="form-control" ng-model="gallerySetting" ng-options="setting for setting in gallery_settings" ng-change="setGalleryType(gallerySetting)">
</select>
这是从控制器用于填充下拉的代码:
$scope.gallery_settings = ['Public', 'Private', 'Hidden'];
当公共,私有或隐藏被选择,它们被传递到setGalleryType看起来像这样的功能:
$scope.setGalleryType = function (galleryType) {
switch (galleryType) {
case 'Public':
$scope.event.private_gallery = 0;
$scope.event.active = 1;
break;
case 'Private':
$scope.event.private_gallery = 1;
$scope.event.active = 1;
break;
case 'Hidden':
$scope.event.private_gallery = 0;
$scope.event.active = 0;
break;
}
};
所有这些都按照ex pected。问题是应用程序重新加载的时间。由于gallerySetting模型未存储在后端,因此下拉菜单不再使用正确的选项填充。这对用户来说非常混乱,他们认为设置没有正确保存。
我需要以某种方式设置基于event.private_gallery
和event.active
值的下拉菜单。我想下面的代码,但会要求范围的问题并没有什么后下拉,然后确认为角:
$scope.setGallerySetting = function() {
if ($scope.event.private_gallery == 0 && $scope.event.active == 1){
return 'Public';
} ...
};
$scope.gallerySetting = $scope.setGallerySetting();
任何想法的基础的方式来做到这一点?
答
我能够把它添加到控制器:
var setGallerySetting = function() {
if ($scope.event.private_gallery == 0 && $scope.event.active == 1){
$scope.gallerySetting = 'Public';
} else if ($scope.event.private_gallery == 1 && $scope.event.active == 1){
$scope.gallerySetting = 'Private';
} else {
$scope.gallerySetting = 'Hidden';
}
};
$scope.$watch('event.active', setGallerySetting);
$scope.$watch('event.private_gallery', setGallerySetting);
这看起来查找任何更改event.active或event.private_gallery模型,并设置相应gallerySetting模型。这是一种效率低下的方式,因为我们只需要在应用程序运行时运行一次,所以我们将不胜感激任何关于改进的建议。