angularJs - 将同一个数据集绑定到两个 <select> 元素,一个有默认值,另一个没有
angularJs - bind same dataset to two <select> elements, one with default value and the other without
我在 angular 中有一个数据集,我在其中添加了一个默认值,如下所示:
vm.serviceProperties.serviceCategories = clientcontext.clientlookup.serviceCategoryLookups();
vm.serviceProperties.serviceCategories.splice(0, 0, { 'serviceCategoryId': 0, 'serviceCategoryDisplayName': 'All' });
我需要将此数据集绑定到两个 select 控件。首先,我需要将 'All' 值显示为默认值。另一方面,我根本不需要 'All' 值。
如何使用相同的数据集实现这一点?我记得我在某个地方看到过,如果不在数据集本身中定义默认值,我们可以在 .如下所示:
<select>
<option> default</option>
<option ng-repeat="the dataset"></option>
</select>
但我不确定如何正确执行。
在控制器上创建一个 属性 来确定是否显示默认选项。
控制器
app.controller('servicePropertiesWithDefault', function() {
$scope.showDefault = true;
});
app.controller('servicePropertiesWithoutDefault', function() {
$scope.showDefault = false;
});
然后在模板中我们使用 ng-if
通过传入 showDefault
作为表达式来显示或隐藏 default
选项。使用 ng-if
优于 ng-show
,因为它从 DOM.
中删除元素
模板
<select>
<option ng-if='showDefault'> default</option>
<option ng-repeat="the dataset"></option>
</select>
我在 angular 中有一个数据集,我在其中添加了一个默认值,如下所示:
vm.serviceProperties.serviceCategories = clientcontext.clientlookup.serviceCategoryLookups();
vm.serviceProperties.serviceCategories.splice(0, 0, { 'serviceCategoryId': 0, 'serviceCategoryDisplayName': 'All' });
我需要将此数据集绑定到两个 select 控件。首先,我需要将 'All' 值显示为默认值。另一方面,我根本不需要 'All' 值。
如何使用相同的数据集实现这一点?我记得我在某个地方看到过,如果不在数据集本身中定义默认值,我们可以在 .如下所示:
<select>
<option> default</option>
<option ng-repeat="the dataset"></option>
</select>
但我不确定如何正确执行。
在控制器上创建一个 属性 来确定是否显示默认选项。
控制器
app.controller('servicePropertiesWithDefault', function() {
$scope.showDefault = true;
});
app.controller('servicePropertiesWithoutDefault', function() {
$scope.showDefault = false;
});
然后在模板中我们使用 ng-if
通过传入 showDefault
作为表达式来显示或隐藏 default
选项。使用 ng-if
优于 ng-show
,因为它从 DOM.
模板
<select>
<option ng-if='showDefault'> default</option>
<option ng-repeat="the dataset"></option>
</select>