RazorPage に asp-page, asp-page-*, asp-route, asp-route-* タグを記述しても動作しない動作について紹介します。
概要
RazorPageに asp-page, asp-page-*, asp-route, asp-route-* 属性のタグを記述しても動作しない現象について紹介します。
動作の確認
下記のRazorPageを作成します。
@page
@model TagHelperDemo.Pages.BlankModel
@{
}
<html>
<head>
</head>
<body>
<p>asp-route-id テストページ</p>
<a asp-page="/Action1">アクション1</a><br />
<a asp-page="/Action2">アクション2</a><br />
</body>
</html>
プロジェクトを実行します。下図の画面が表示されます。aタグの文字列にリンクが設定されていない状態で表示されます。
ページのタグは次の通りです。
asp-page属性がそのまま表示されています。
<html>
<head>
</head>
<body>
<p>asp-page テストページ</p>
<a asp-page="/Action1">アクション1</a><br />
<a asp-page="/Action2">アクション2</a><br />
</body>
</html>
原因
asp-page asp-page-* asp-route asp-route-* タグはタグヘルパーの機能のため、タグヘルパーの追加が必要です。
@addTagHelperディレクティブを記述してタグヘルパーの機能を追加しないと、タグが処理されません。
修正
RazorPageを下記に変更します。
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers を追加します。
@page
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@model TagHelperDemo.Pages.BlankModel
@{
}
<html>
<head>
</head>
<body>
<p>asp-route-id テストページ</p>
<a asp-page="/Action1">アクション1</a><br />
<a asp-page="/Action2">アクション2</a><br />
</body>
</html>
実行結果
プロジェクトを実行し、上記のRazorPageを表示します。下図のページが表示されます。aタグの文字列のリンクが有効な状態になっています。
ページのタグは次の通りです。
asp-page属性が変換され、href属性に書き換えられています。
<html>
<head>
</head>
<body>
<p>asp-page テストページ</p>
<a href="/Action1">アクション1</a><br />
<a href="/Action2">アクション2</a><br />
</body>
</html>
著者
iPentecのメインプログラマー
C#, ASP.NET の開発がメイン、少し前まではDelphiを愛用
最終更新日: 2021-10-28
作成日: 2021-05-16
