Angular模型值显示为一个对象
Angular model value is appearing as an object
我有一个保存用户首选项的函数。这些首选项是通过3个下拉(选择)对象选择的。下拉列表用以下代码填充:
<div ng-controller="UserCtrl">
<div class="row" ng-show="$parent.loggedin">
<div class="col-sm-3">
<div class="form-group">
<label for="lawType">Select a Type of Law</label>
<select class="form-control" id="lawType" name="lawType" ng-change="getCourthouse();" ng-model="typeoflaw.LitigationType" ng-options="typeoflaw.LitigationType for typeoflaw in typeoflaw track by typeoflaw.LitigationCode" required>
<option value="">--Select a Type of Law--</option>
<!-- <option value="0" selected>--Select a Type of Law--</option>
<option ng-repeat="type in typeoflaw" value="{{ type.LitigationCode}}">{{ type.LitigationType }}</option>-->
</select>
</div>
</div>
<div class="col-sm-3">
<div class="form-group" ng-show="courtHouse.length">
<label for="courtHouse">Select a Courthouse</label>
<select class="form-control" id="courtHouse" name="courtHouse" ng-model="courtHouse.Loc_ID" ng-change="getCourtroom();" ng-options="courtHouse.Loc_Name for courtHouse in courtHouse track by courtHouse.Loc_Name" required>
<option value="">--Select a Courthouse--</option>
<!--<option ng-repeat="bldg in courtHouse track by $index" value="{{ bldg.Loc_ID }}">{{ bldg.Loc_Name }}</option>-->
</select>
</div>
</div>
<div class="col-sm-3">
<div class="form-group" ng-show="courtRoom.length">
<label for="courtRoom">Select a Department</label>
<select class="form-control" id="courtRoom" name="courtRoom" ng-model="courtRoom.CourtRoom" ng-options="courtRoom.CourtRoom for courtRoom in courtRoom track by courtRoom.CourtRoom" required>
<option value="">--Select a Department--</option>
<!-- <option ng-repeat="room in courtRoom" value="{{ room.CourtRoom }}">{{ room.CourtRoom }}</option>-->
</select>
</div>
</div>
<div class="col-sm-3">
<div class="favorite-button" ng-show="courtRoom.length">
<button class="btn btn-primary pull-left" ng-click="SavePreferences();">Add Favorite</button>
</div>
</div>
</div>
<div class="row" ng-show="userPreferences.length">
<div class="col-sm-12 favorite-header">
<h2>Your Saved Favorites</h2>
</div>
</div>
<div class="row" ng-show="userPreferences.length">
<div class="col-sm-3 favorite-column-title">
Courthouse
</div>
<div class="col-sm-3 favorite-column-title">
Department
</div>
<div class="col-sm-3 favorite-column-title">
Type of Law
</div>
<div class="col-sm-3 favorite-column-title">
Default
</div>
</div>
<div class="row" ng-show="userPreferences.length" ng-model="userPreferences" ng-repeat-start="userPreference in userPreferences">
<div class="col-sm-3">
{{ userPreference.LocName }}
</div>
<div class="col-sm-3">
{{ userPreference.CourtRoom}}
</div>
<div class="col-sm-3">
{{ userPreference.LitigationType }}
</div>
<div class="col-sm-3">
<span ng-if="showDefaultIcon(userPreference.IsDefault);" class="glyphicon glyphicon-ok green-check"></span>
<span ng-if="!showDefaultIcon(userPreference.IsDefault);" class="glyphicon glyphicon-heart red-heart" ng-click="setAsDefault();"></span>
</div>
</div>
<div ng-repeat-end></div>
</div>
函数的代码如下:
$scope.SavePreferences = function () {
$scope.userid = 'dpeng';
$scope.departmentNumber = $scope.courtRoom.CourtRoom;
$scope.newPreference = {
"PreferenceID": "0",
"UserID": $scope.userid,
"LocID": $scope.courtHouseId.Loc_ID,
"CourtRoom": $scope.departmentNumber,
"IsDefault" : $scope.isDefault
};
$http({
method: 'POST',
url: 'http://10.34.34.46/BenchViewServices/api/UserPreference/Post',
data: $scope.newPreference,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).error(function (status, data) {
console.log(data.error);
});
}
当$scope。newPreference被发送到服务器。法庭是一个对象,而不仅仅是一个直接的值。所以基本上是"法庭"。法庭= 5"我只想要"5".
这是我在Visual Studio调试器中看到的:
法庭:对象
法庭:"A12" <——这是我展开法庭时看到的效果
proto: Object
IsDefault: false
LocID: "ATP"
PreferenceID: "0"
用户id: "dpeng"
proto: Object
我如何直接得到那个值而不让它返回给我一个对象?
编辑说明:
根据到目前为止我得到的答案,我可以说我的问题问得不够清楚。
我想发送对象newPreference到服务,但是WITHIN newPreference是一个名为"法庭"的对象,我不想让它作为一个对象,我想让它作为一个单一的值。现在它是作为一个对象发送的,而所有其他参数都是作为一个单独的项发送的。
您应该在HTTP POST中只发送法庭值,而不是整个newPreference对象:
$http({
method: 'POST',
url: 'http://10.34.34.46/BenchViewServices/api/UserPreference/Post',
data: $scope.newPreference.CourtRoom,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).error(function (status, data) {
console.log(data.error);
});
如果您只想发送CourtRoom
参数,那么您必须这样做:
$http({
method: 'POST',
url: 'http://10.34.34.46/BenchViewServices/api/UserPreference/Post',
params: {
CourtRoom: $scope.departmentNumber
},
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
既然你使用表单数据,你应该使用params
而不是data
。https://stackoverflow.com/a/11443066/2163901
我改变了我的函数如下:
$scope.SavePreferences = function () {
$scope.userid = 'dpeng';
$scope.departmentNumber = $scope.courtRoom.CourtRoom;
$scope.newPreference = {
"PreferenceID": "0",
"UserID": $scope.userid,
"LocID": $scope.courtHouseId.Loc_ID,
"CourtRoom": $scope.departmentNumber.CourtRoom,
"IsDefault" : $scope.isDefault
};
$http({
method: 'POST',
url: 'http://10.34.34.46/BenchViewServices/api/UserPreference/Post',
data: $scope.newPreference,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).error(function (status, data) {
console.log(data.error);
});
}
我添加了。法庭,它成功了。
相关文章:
- .effect('幻灯片'..不显示下一个对象
- 正在更改显示的<李>单击另一个对象
- 我想显示一个对象's在chrome中的值's控制台
- Javascript - 循环访问对象数组,仅显示最后一个对象
- ng-repeat失败,并显示一个对象数组
- js/jquery对象显示只是一个快速的闪光
- 节点v0.10.36显示一个对象的原型
- for 循环仅显示数组中的最后一个对象
- 单击一个对象并显示另一个简单的jQuery片段
- 如何从JavaScript数组/对象显示图像?从第一个图像开始,然后点击到下一个
- Angular模型值显示为一个对象
- 如何创建一个过滤器,在列出其他对象之前显示一个对象?
- 当用匿名函数括起一个对象时,显示错误消息
- 显示数组中的下一个对象值
- if应该只显示一个对象
- 如何在Javascript中添加一个对象时使字符串显示为数组返回到数组
- 我在一个对象中创建了两个不同的对象.在打印它们时,只显示最后修改的对象.如何创造
- Angular,过滤并显示数组中的一个对象
- 返回一个对象,显示单击了哪个元素
- 遍历数组的JavaScript/AngularJS只显示一个对象