为什么我的网址操作会返回未找到的错误?我有一个Recipes表,我使用angular-datatables生成,每个都有一个View按钮,其中href链接和id值指向Details视图。进入详细信息视图后,我需要在角度控制器中获取id值。
Index.cshtml
@{
ViewBag.Title = "Recipes";
}
<br />
<div class="col-md-12 center">
<a href="/Recipes/Create"><input type="button" value="Create" class="btn btn-default" /></a>
</div>
<br/>
<br/>
<div>
<table datatable="tblRecipe" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" dt-instance="showCase.dtInstance" class="table table-bordered"></table>
</div>
@*edit modal...*@
@section Scripts {
@Scripts.Render("~/bundles/indexRecipe")
}
indexRecipe.js控制器
var app = angular.module('app', ['datatables'])
app.controller('MainController', function ($scope, $window, $http, $filter, $timeout, $compile, DTOptionsBuilder, DTColumnDefBuilder, DTColumnBuilder, EditRecipe, $rootScope) {
var vm = this;
vm.message = '';
vm.dtInstance = {};
vm.Recipes = {};
vm.delete = deleteRow;
vm.edit = editRow;
vm.Update = updateRow;
vm.dtOptions = DTOptionsBuilder.newOptions()
.withOption('ajax', {
url: "/Recipes/GetAllRecipes",
type: "POST"
})
.withOption('createdRow', createdRow)
.withOption('select', true);
vm.dtColumns = [
//....
DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable().renderWith(actionsHtml)
];
function createdRow(row, data, dataIndex) {
// Recompiling so we can bind Angular directive to the DT
$compile(angular.element(row).contents())($scope);
}
//function deleteRow(recipe)
//function editRow(recipe
function actionsHtml(data, type, full, meta) {
vm.Recipes[data.Id] = data;
return '<a title="View" href="@Url.Action("Details", "Recipes", new { id = '+data.Id+' })">' +
' <i class="fa fa-eye" aria-hidden="true"></i>' + '</a>' + '<a title="Edit" href="javascript:void(0)" ng-click="showCase.edit(showCase.Recipes[' + data.Id + '])">' +
' <i class="fa fa-pencil"></i>' + '</a>' + '<a title="Delete" href="javascript:void(0)" ng-click="showCase.delete(showCase.Recipes[' + data.Id + '])" )"="">' + ' <i class="fa fa-trash-o"></i>' + '</a>';
};
//function updateRow(recipe, ings, tags, files)
});
app.service("EditRecipe", function ($http) {
this.EditById = function (recipe) {
var response = $http({
method: "post",
url: '/Recipes/Edit',
data: JSON.stringify(recipe)
});
return response;
}
this.Update = function (recipe, ings, tags, files) {
var response = $http({
method: "post",
url: '/Recipes/Update',
data: JSON.stringify(recipe)
});
return response;
}
});
的RecipesController
public ActionResult Details(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Recipe recipe = db.Recipes.Find(id);
if (recipe == null)
{
return HttpNotFound();
}
return View(recipe);
}
href="@Url.Action("Details", "Recipes", new { id = "+data.Id+" })"
或href="@Url.Action("Details", "Details", new { id = "+data.Id+" })"
或href="@Url.Action("Details", "Recipes")"
会返回以下网址。
http://localhost:57104/Recipes/@Url.Action(
Error Code: 0x80070002
答案 0 :(得分:1)
您无法在JS文件中访问Razor帮助器方法。 Razor语法仅适用于.cshtml或.vbhtml文件。所以你可以做类似下面的事情。在.cshtml文件中定义一个javascript变量,并在外部JS文件中访问它。
<强> Index.cshtml 强>
<script>
var URL={
Details:'@Url.Action("Details", "Recipes")',
}
</script>
indexRecipe.js控制器
return '<a title="View" href='+URL.Details+'?id='+data.Id >' +
' <i class="fa fa-eye" aria-hidden="true"></i>' + '</a>' + '<a title="Edit" href="javascript:void(0)" ng-click="showCase.edit(showCase.Recipes[' + data.Id + '])">' +
' <i class="fa fa-pencil"></i>' + '</a>' + '<a title="Delete" href="javascript:void(0)" ng-click="showCase.delete(showCase.Recipes[' + data.Id + '])" )"="">' + ' <i class="fa fa-trash-o"></i>' + '</a>';