Question

我无法在Angular2 / .Net Core中进行路由以正常工作。

我已经使用Angular启动了默认的.Net Core Web项目，并已成功创建了一个包含适用视图组件的新控制器。该页面的目的是显示文档列表，并为您提供单击标题的选项，以便在单独的视图中查看每个文档。

只要一切正常，它就会显示页面内容，我还可以显示从数据库中检索到的文档列表。路由如下所示：

@NgModule({
    declarations: [
        AppComponent,
        NavMenuComponent,
        DocumentsComponent,
        HomeComponent
    ],
    imports: [
        CommonModule,
        HttpModule,
        FormsModule,
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'home', component: HomeComponent },
            { path: 'documents', component: DocumentsComponent },
            { path: '**', redirectTo: 'home' }
        ])
    ]
})
export class AppModuleShared {
}

我在每个文档上都有一个链接，这样当您单击它时，您将从列表/documents转移到例如。 /documents/1

当我点击链接时，它只会在那里停留足够长的时间，以便我可以看到网址更改，然后转到默认的后备/home。

在Startup.cs中我有默认的路由处理集：

app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "default",
        template: "{controller=Home}/{action=Index}/{id?}");
    routes.MapSpaFallbackRoute(
        name: "spa-fallback",
        defaults: new { controller = "Home", action = "Index" });
});

据我所知，“默认”地图路线应该选择/documents/1，但事实并非如此。我甚至都没有进入该路线的后端方法。

[Produces("application/json")]
[Route("api/[controller]")]
public class DocumentsController : Controller
{
    private readonly DatabaseContext _context;

    public DocumentsController(DatabaseContext context)
    {
        _context = context;
    }

    // GET: api/Documents
    [HttpGet]
    public IActionResult GetDocuments()
    {
        // returns a JSON list of documents, works fine
    }

    // GET: api/Documents/5
    [HttpGet("{id}")]
    public async Task<IActionResult> GetDocument([FromRoute] int id)
    {
        //returns the specified document, is never even called
        if (!ModelState.IsValid)
        {
            return BadRequest(ModelState);
        }

        var document = await _context.Documents.SingleOrDefaultAsync(m => m.Id == id);

        if (document == null)
        {
            return NotFound();
        }

        return Ok(document);
    }

我需要做些什么才能使特定路线发挥作用？

Answer 1

据我所知，“默认”地图路线应该选择/documents/1，但事实并非如此。

不。默认路由未配置为该方式。您必须提供操作方法名称作为第二个参数以匹配默认路由。

/documents/getdocument/1

那说，它不会起作用。添加属性路径时，它会自动阻止上述路径。

因此，唯一可以访问DocumentsController.GetDocument(int)的网址是：

/api/documents/1

这是因为您在控制器上定义了[Route("api/[controller]")]，这使得控制器中的每个操作都以这种方式加上前缀。

如果您希望/documents/1成为网址并使用属性路由，则可以使用：

[Produces("application/json")]
[Route("documents")]
public class DocumentsController : Controller
{
    private readonly DatabaseContext _context;

    public DocumentsController(DatabaseContext context)
    {
        _context = context;
    }

    // GET: api/Documents
    [HttpGet(Order = 2)]
    public IActionResult GetDocuments()
    {
        // returns a JSON list of documents, works fine
    }

    // GET: api/Documents/5
    [HttpGet("{id}", Order = 1)]
    public async Task<IActionResult> GetDocument([FromRoute] int id)
    {
        //returns the specified document, is never even called
        if (!ModelState.IsValid)
        {
            return BadRequest(ModelState);
        }

        var document = await _context.Documents.SingleOrDefaultAsync(m => m.Id == id);

        if (document == null)
        {
            return NotFound();
        }

        return Ok(document);
    }
}

或者，如果您要使用基于约定的路由，请从控制器中删除[Route]属性，从每个操作方法上方的Order中删除网址模板和HttpGet，然后使用：

app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "documents",
        template: "documents/{id?}",
        defaults: new { controller = "Documents", action = "GetDocuments" });

    routes.MapRoute(
        name: "default",
        template: "{controller=Home}/{action=Index}/{id?}");
});

Answer 2

你需要告诉角度路由器在路径的documents部分之后还有更多。它正在寻找与路线/documents/1匹配但未找到它的组件。如果您在路径中添加/:id，则应允许其将网址的第二部分映射到路线，而不是重定向到home

{ path: 'documents/:id', component: DocumentsComponent },

路由到angular2 / .net核心中的特定ID

2 个答案: