web-dev-qa-db-ja.com

AngularルーティングテンプレートURLは、ASP.Net MVC 5プロジェクトで* .cshtmlファイルをサポートしていますか？

私はMVC 5プロジェクトに取り組んでいます。ビューでhtmlページを使用すると、そのページが読み込まれますが、.cshtmlページを使用すると、ビューが読み込まれません。空白ページが表示されます。

$urlRouterProvider
    .otherwise('/app/dashboard');

$stateProvider            
    .state('app', {
        abstract: true,
        url: '/app',
        templateUrl: 'tpl/app.html'
    })
    .state('app.dashboard', {
        url: '/dashboard',
        templateUrl: 'tpl/app_dashboard.html'
    })

Cshtmlファイルの使用方法または最適な方法を教えてください。

javascriptc#angularjsasp.net-mvcrazor
23
Faizan

はい、できます。

Yasser's に同様の回答を追加しますが、ngRouteを使用します。

1）部分的なHTMLを参照する代わりに、コントローラー/アクションをASP.NET MVCアプリに参照する必要があります。

.when('/order', {
    templateUrl: '/Order/Create',
    controller: 'ngOrderController' // Angular Controller
})

2）ASP.NET MVCは.cshtmlビューを返します。

public class OrderController : Controller
{
    public ActionResult Create()
    {
        var model = new MyModel();
        model.Test= "xyz";

        return View("MyView", model);
    }
}

3）MyView.cshtmlは、RazorとAngularを混合します。重要：Angularアプリのパーシャルとして、レイアウトをnullに設定します。

@model MyProject.MyModel

@{
   Layout = null;
}

<h1>{{ Test }}</h1> <!-- Angular -->
<h1>Model.Test</h1> <!-- Razor -->
29
Zanon

できません。

angularルートのテンプレートURLで.cshtmlファイルへのパスを使用することはできません。ブラウザで.cshtmlファイルを開くことはできますか？いいえ、ここでも同じことが当てはまります。

回避策：

.cshtmlファイルにはサーバー側のコードが含まれています。レンダリングするには、コントローラーとアクションを使用する必要があります。その.cshtmlファイルが表示されます。コントローラーアクションにそのビューを返させ、angularルートでコントローラーアクションへのURLを使用します。

例えば：

state('app.dashboard', {
        url: '/dashboard',
        templateUrl: '/dashboard/index'
     })

と

public class DashboardController : Controller
{
    public ActionResult Index()
    {
        return View();
    }
}

p.s：試しましたが、これは私のために働いた

30
Yasser

AngleJsビューとRazorビューを混在させることはできません。razorはサーバーにロードされ、angularはビューをレンダリングするためにブラウザーで実行されるjavascriptを使用するクライアントで実行されます。 .NETを使用しているため、Web APIまたはサービススタックである可能性があるため、残りのAPIをバックエンドとして使用します。

あなたができることは、メインの「インデックスページ」としてカミソリビューを実行することですが、そこからanglejsに「内部」ページのルーティングを処理させます。

angular=はasp.net mvcアーキテクチャの異なる視点である シングルページアプリケーション のアイデアに基づいて構築されていることに注意してください。

1
jack.the.ripper

cshtmlは基本的にカミソリ構文を使用したインラインcsharpコードであり、サーバーサイトでhtmlにレンダリングされるため、ブラウザはc＃を認識しないため、angularルーティングでは使用できません

0
sylwester