本文介绍了角UI的选择:如何唯一入选的值绑定到NG-模型的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
$scope.property = new Property();
$scope.property.propertyType = {};
$scope.propertyTypes = [
{ value: 'ResidentialPlot', name: 'Residential Plot' },
{ value: 'CommercialPlot', name: 'Commercial Plot' },
{ value: 'Apartment', name: 'Apartment/Flat' },
{ value: 'Townhouse', name: 'Townhouse' },
{ value: 'House', name: 'Single Family House' },
{ value: 'Commercial', name: 'Commercial Property' }
];
<label for="ptype" class="col-sm-2 control-label">Property Type</label>
<p>Populated: {{property.propertyType}}</p>
<ui-select ng-model="property.propertyType" id="ptype" theme="selectize" ng-disabled="disabled" style="width: 300px;" title="Choose Property Type">
<ui-select-match placeholder="Select a Property Type">{{$select.selected.value}}</ui-select-match>
<ui-select-choices repeat="propType in propertyTypes">
<span ng-bind-html="propType.name"></span>
<small ng-bind-html="propType.value"></small>
</ui-select-choices>
这给了我:
$scope.PropertyType = {"value":"Apartment","name":"Apartment/Flat"}
属性类型在我的模式只是一个字符串,所以我要绑定选择的值,而不是选择JSON项目。
PropertyType in my schema is just a string so I want to bind selected value instead of selected JSON Item.
$scope.PropertyType = "Apartment"
我要绑定到我的NG-模型得到什么呢?
What should I bind to my ng-model to get this?
推荐答案
您需要在您的选择输入的NG-模型属性更改为 selected_propertyType
,当它看着它变化,然后提取值,并将其分配给属性类型
You need to change in your select input the ng-model attribute to selected_propertyType
and watch it when it changes, then extract value and assign it to propertyType
$scope.property = new Property();
$scope.property.propertyType = {};
$scope.propertyTypes = [
{ value: 'ResidentialPlot', name: 'Residential Plot' },
{ value: 'CommercialPlot', name: 'Commercial Plot' },
{ value: 'Apartment', name: 'Apartment/Flat' },
{ value: 'Townhouse', name: 'Townhouse' },
{ value: 'House', name: 'Single Family House' },
{ value: 'Commercial', name: 'Commercial Property' }
];
$scope.$watch('selected_propertyType',function(newValue,oldValue){
if (newValue && newValue!=oldValue){
$scope.propertyType = $scope.selected_propertyType.value;
}
})
<label for="ptype" class="col-sm-2 control-label">Property Type</label>
<p>Populated: {{property.selected_propertyType}}</p>
<ui-select ng-model="property.selected_propertyType" id="ptype" theme="selectize" ng-disabled="disabled" style="width: 300px;" title="Choose Property Type">
<ui-select-match placeholder="Select a Property Type">{{$select.selected.value}}</ui-select-match>
<ui-select-choices repeat="propType in propertyTypes">
<span ng-bind-html="propType.name"></span>
<small ng-bind-html="propType.value"></small>
</ui-select-choices>
这篇关于角UI的选择:如何唯一入选的值绑定到NG-模型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!