当我单击表中的发送按钮时遇到问题,它不会将我带到请求的页面,我检查了数据库和服务器端的所有方面,我不明白为什么我收到错误 400代码角度
添加链接可以下载代码 http://www.filedropper.com/finalproject_3
<script>
(function (app) {
app.controller('FrameController', FrameController)
})(angular.module('TestApp', ['ngAnimate', 'ngAria', 'ngMaterial']));
</script>
</head>
<body ng-controller="FrameController">
<div ng-cloak>
<md-content>
<div layout="row" layout-wrap>
<div flex="50">
<div class="mdl-grid">
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline"> </span>
</md-card-title-text>
<md-card-title-media>
<md-progress-linear md-mode="indeterminate"></md-progress-linear>
<div class="md-media-lg card-media"></div>
</md-card-title-media>
</md-card-title>
<md-card-content>
<md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
<md-select ng-model="searchText" placeholder="choose place" class="md-no-underline">
<md-option value="Club">Club</md-option>
<md-option value="Bar">Bar</md-option>
<md-option value="Dance-Bar">Dance-Bar</md-option>
<md-option value="Resturant">Resturant</md-option>
<md-option value=" coffe-shops">Coffe-shops</md-option>
</md-select>
<input type="text" placeholder="enter the place you want" ng-model="searchText.Title">
</md-card-content>
<md-card-actions layout="row" layout-align="end center">
</md-card-actions>
</md-card>
</div>
</div>
<table class="mdl-data-table mdl-js-data-table mdl-shadow--2dp">
<thead>
<tr>
<th class="mdl-data-table__cell--non-numeric">Title</th>
<th>Description</th>
<th>Phone</th>
<th>City</th>
<th>Street</th>
</tr>
</thead>
<tbody>
<tr ng-repeat= "row in rows | filter:searchText">
<td class="mdl-data-table__cell--non-numeric">{{row.Title}}</td>
<td>{{row.Description}}</td>
<td>{{row.Phone}}</td>
<td>{{row.City}}</td>
<td>{{row.Street}}</td>
<td><button ng-click="send(row)">Send</button></td>
</tr>
</tbody>
</table>
</md-content>
代码 js
function FrameController($scope, $http) {
var data;
$http.get('/api/places/frames/frame').then(function (response) {
$scope.rows = response.data.map(function (item) {
return new MenuEventModel(item);
});
data = angular.copy($scope.rows);
$scope.loaded = true;
console.log($scope.rows);
$scope.send = function (row) {
console.log(row);
window.location.href = 'Detail.html?Id=' + row.Title;
};
});
}
代码 C# 服务器端
[HttpGet]
[Route("api/Places/Details/Detail")]
public IHttpActionResult Test(int Id)
{
var service = Services.SqlPool.PlacesService;
using (var conn = service.StartConnection())
{
var result = service.SelectAsList<Models.EventsByDays>(conn, "spGetDetailsAboutPlace", new SqlParameter("@Id", Id));
service.StopConnection(conn);
return Ok(result);
}
}
public void Dispose()
{
// any operation which aim to free memory is welcomed here :)
}
}
更改您的
window.location.href = 'Detail.html?Id=' + row.Title;
跟
var linkStart = 'Detail.html?Id=' + row.Title;
$state.go(linkStart);
(并且不要忘记添加带有$http和$scope的$state(
编辑:
function FrameController($scope, $http, $state) {
var data;
$http.get('/api/places/frames/frame').then(function (response) {
$scope.rows = response.data.map(function (item) {
return new MenuEventModel(item);
});
data = angular.copy($scope.rows);
$scope.loaded = true;
console.log($scope.rows);
$scope.send = function (row) {
console.log(row);
var linkStart = 'Detail.html?Id=' + row.Title;
$state.go(linkStart);
};
});
}
或者使用$window而不是$state。
将
html 更改为:
<head>
<script>
(function (app) {
app.controller('FrameController', FrameController)
})(angular.module('TestApp', ['ngAnimate', 'ngAria', 'ngMaterial']));
</script>
</head>
<body ng-controller="FrameController">
<div ng-cloak>
<md-content>
<div layout="row" layout-wrap>
<div flex="50">
<div class="mdl-grid">
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline"> </span>
</md-card-title-text>
<md-card-title-media>
<md-progress-linear md-mode="indeterminate"></md-progress-linear>
<div class="md-media-lg card-media"></div>
</md-card-title-media>
</md-card-title>
<md-card-content>
<md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
<md-select ng-model="searchText" placeholder="choose place" class="md-no-underline">
<md-option value="Club">Club</md-option>
<md-option value="Bar">Bar</md-option>
<md-option value="Dance-Bar">Dance-Bar</md-option>
<md-option value="Resturant">Resturant</md-option>
<md-option value=" coffe-shops">Coffe-shops</md-option>
</md-select>
<input type="text" placeholder="enter the place you want" ng-model="searchText.Title">
</md-card-content>
<md-card-actions layout="row" layout-align="end center">
</md-card-actions>
</md-card>
</div>
</div>
<table class="mdl-data-table mdl-js-data-table mdl-shadow--2dp">
<thead>
<tr>
<th class="mdl-data-table__cell--non-numeric">Title</th>
<th>Description</th>
<th>Phone</th>
<th>City</th>
<th>Street</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in rows | filter:searchText">
<td class="mdl-data-table__cell--non-numeric">{{row.Title}}</td>
<td>{{row.Description}}</td>
<td>{{row.Phone}}</td>
<td>{{row.City}}</td>
<td>{{row.Street}}</td>
<td><button ng-click="send($event, row)">Send</button></td>
</tr>
</tbody>
</table>
</div>
</md-content>
</div>
</body>
并将您的 JavaScript 代码更改为:
function FrameController($scope, $http, $window) {
var data;
$http.get('/api/places/frames/frame').then(function (response) {
$scope.rows = response.data.map(function (item) {
return new MenuEventModel(item);
});
data = angular.copy($scope.rows);
$scope.loaded = true;
console.log($scope.rows);
$scope.send = function (e, row) {
e.preventDefault();
console.log(row);
$window.location.href = 'http://...' + 'Detail.html?Id=' + row.Title;
};
});
}