Angular路由模板URL支持ASP.Net MVC 5项目中的*.cshtml文件吗？

13 浏览
0 Comments

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文件或最好的方法。

admin 更改状态以发布 2023年5月21日
0

2 答案

0 Comments

你不能。

你不能在你的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();
    }
}

附注：我尝试过这个方法，它对我起作用了。

0
0 Comments

是的，你可以。

添加一个类似于 Yasser 的答案，但使用 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;
}

{{ Test }}
 

Model.Test

0