Question

我正在使用ocLazyLoad库来延迟加载角度javascript / html文件并将它们注入我的模块，就像这段代码片段一样：

    $routeProvider.when('/Home/Index', {
        templateUrl: '/app/Index.html',
        controller: 'IndexController',
        resolve: {
            deps: [
                '$ocLazyLoad', function ($ocLazyLoad) {
                    return $ocLazyLoad.load({}, {
                        name: 'mix',
                        files: [
                            '/app/IndexController.js'
                        ]
                    });
                }
            ]
        }
    });

通过这种方法，我从文件系统中获取静态html文件。但我想要的是设置templateUrl：＆＃39; / Home / Index＆＃39;所以Home控制器中的Index action方法被执行，razor呈现指定的.cshtml页面，然后返回带有angular指令的html。

这是我想要做的。剃刀观点：

<p>
    @foreach (var item in new List<int> { 1, 2, 3, 4, 5 })
    {
        @item
    }
</p>

<div ng-controller="IndexController as vm">
    <p>{{vm.text}}</p>
    <p>{{3 + 3}}</p>
</div>

来自服务器的响应：

<p>12345</p>
<div ng-controller="IndexController as vm">
    <p>{{vm.text}}</p>
    <p>{{3 + 3}}</p>
</div>

随着这个html，延迟加载了IndexController.js 那么棱角就能完成它的工作。

有可能吗？

Answer 1

是的，可以这样做。您需要做的就是记住基础知识。除非你公开它，否则Angular对你的服务器端一无所知。

$routeProvider.when('/ng-Home/Index', { //It can't be the same as the Action URL since it won't work the way you want it to.
    templateUrl: '/Home/Index', //Add the html of your static page into the razor view.
    controller: 'IndexController'
    }
});

在内部，angular将从服务器端调用纯HTML文件或从服务器输出的HTML（HTML响应，而不是JSON或XML）。 Angular并不关心它是文件还是响应HTML。路由将简单地采用响应HTML并输出它。

通常这可能会变得混乱，因为并非所有Razor生成的HTML都符合处理模型的角度方式。但它可以帮助您实现一些方便的东西，比如使用ASP.NET中的捆绑和缩小。或者将部分视图直接添加到HTML中。

在Razor视图中，您可以通过以下方式添加JS文件：

@Scripts.Render("~/Path/To/Script")

希望它有所帮助！

如何使用ngRoute从angularjs获取razor渲染的html

1 个答案: