Question

我是Angular世界的新手，目前正试图为我们的ASP.NET MVC项目完成一个干净的设计，其中每个Angular控制器都在一个单独的文件中。我的问题是，是否有可能延迟加载Angular控制器？我目前正在与RequireJS斗争。我的概念证明代码如下：

CSHTML视图 - Index.cshtml

<script src="~/Scripts/Controllers/mainController.js"></script> 
<div class="row" ng-controller="MainController">
    <div class="col-md-4">
        <span>{{1+1}}</span>

        Message Test: {{testmessage}}
        <button ng-click="ucase()">Upper</button>
</div>

_Layout.cshtml（仅显示ng-app的第一行）

<html ng-app="mainModule">

app.js

var mainModule = angular.module("mainModule", []);

mainController.js

angular.module('mainModule').controller('MainController', ['$scope', function ($scope) {
    $scope.testmessage = "hello world!";
    $scope.ucase = function () {
        $scope.testmessage = angular.uppercase($scope.testmessage);
    }
}]);

如何摆脱Index.cshtml文件中对mainController.js的引用？有没有办法在需要时延迟加载控制器？ RequireJS可以帮忙吗？

Answer 1

最后，我能够使用ocLazyLoader在我的POC项目中实现延迟加载Angular模块：

https://github.com/ocombe/ocLazyLoad

http://plnkr.co/edit/aGxuXMiPgYA0TFc67YL4（演示）

但是，我仍然不确定我们是否会继续这样做。

使用RequireJS延迟加载Angular控制器

1 个答案: