角度部署问题

Angular deployment issue

本文关键字：问题 部署      更新时间：2023-09-26

我有一个使用angularBootstrapNavTree控件的网站。它在我的本地机器上运行良好。在我的服务器上，我安装了Visual Studio（它是MVC5），并调试了服务器上发生的一个错误，但不是串行化的本地错误。现在，当我转到我的WebAPI2服务的URL时，我的数据就会返回。如果我浏览到带有此脚本的页面（在.js文件中）：

var app, deps;
deps = ['angularBootstrapNavTree'];
if (angular.version.full.indexOf("1.2") >= 0)
{
    deps.push('ngAnimate');
}
app = angular.module('PVU', deps);
app.controller('PVUController', function ($scope, $timeout, $http, $window)
{
    $scope.doing_async = true;
    $scope.data = null;
    $http({ method: 'GET', url: '/Products/GetProducts/' }).
    success(function (data, status, headers, config)
    {
        $scope.doing_async = false;
        return $scope.my_data = data;
    }).
    error(function (data, status, headers, config)
    {
    });
    $scope.clickhandler = function (branch)
    {
        $scope.thedata = branch.data;
        $scope.$apply();
    };
    treedata_avm = [
      {
          label: 'Loading'
      }
    ];

    $scope.my_data = treedata_avm;
});

页面运行，树显示"正在加载"。如果我设置了一个断点，成功函数就会被调用，我的数据就在那里。但是，从调用控制器回调的那一刻起（$scope.doing_async=true；），这个错误就出现在我的控制台上：

Error: [$injector:unpr] http://errors.angularjs.org/1.2.14/$injector/unpr?p0=nProvider%20%3C-%20n%20%3C-%20abnTreeDirective
    at Error (native)
    at http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:6542
    at http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:19418
    at Object.i [as get] (http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:18494)
    at http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:19493
    at i (http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:18494)
    at Object.r [as invoke] (http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:18706)
    at http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:23593
    at Array.forEach (native)
    at r (http://67.214.99.130/bundles/angular?v=RhmTtQ27BhbKD8lYJqRRXD93x9Dmqd7oWtir-Op3k8k1:1:6870)

我以为我安装了Angular的非缩小版，但错误显示在文件的开头，全部在一行，无法读取。链接指向一个页面，上面说没有定义模块，但我检查了一下，所有$xxx对象在方法中都是有效的，我不知道我定义了其他任何东西。。。

我不确定这是否是IIS问题，因为一切都在Visual Studio中工作，但这是我的最后一项部署任务，所以我感谢您的帮助或建议。

感谢

Angular通过字符串匹配处理DI，因此您需要更改以下内容：

app.controller('PVUController', function ($scope, $timeout, $http, $window)

到此：

app.controller('PVUController', 
    ['$scope', '$timeout', '$http', '$window', 
    function ($scope, $timeout, $http, $window){
}]);

在web.config中使用debug=false编译应用程序时，创建的捆绑包会连接在一起并缩小。串联不是问题，但缩小（uglify）过程重命名参数，字符串数组表示法是Angular协调依赖关系的方式，因为作为字符串，缩小过程将忽略它们，从而正确解决依赖关系。

好吧-我已经了解到了这一点。Brocco的答案是什么让我走上了正确的道路，但是，我的js文件没有被捆绑，因此没有被缩小。问题是，角度树控件内部必须有代码，无法在这个过程中幸存下来。这就是为什么其他一切都有效的原因，当它试图介入树代码时，它失败了，因为这就是被破坏的地方。所以，我把树从我的包里移出来，直接把它包括进去，现在一切都正常了。所以，如果你使用这个控件：

https://github.com/eu81273/angular.treeview

而你正在使用MVC5并搜索这个问题的解决方案，这就是它。将它从捆绑包中取出，并将其包含在脚本中，这样它就不会被捆绑，而且它会正常工作。

相关文章：