错误：$injector:strictdi 需要显式注释，但已实现 - 链接到 angular-ui-router？

Question

对我来说，我收到一条荒谬的错误消息，因为我正在做它说我没有做的事情。

http://errors.angularjs.org/1.6.5/$injector/strictdi?p0=function(labelsResource)

它抱怨的代码是下面的代码，完全正确（但我删除了函数 labelsResource 中的实际逻辑）：

(function (module, angular) {
    "use strict";

    var labelsResource = function ($resource, $timeout, salesFlowsContext, applicationConfiguration) { ... };

    labelsResource.$inject = ["$resource", "$timeout", "salesFlowsContext", "applicationConfiguration"];

    module.factory("labelsResource", labelsResource);
}(
    angular.module("common.translation"),
    angular
));

我什至试图通过删除“use strict”来使其工作，但错误仍然存​​在。我忽略了什么？

类似的问题没有答案或对我有用。

编辑：同时我了解到它似乎与我升级 angular-ui-router 有关。 我目前使用的是 0.2.14 版，但是当我移到 1.0.10 版时，我得到了错误。 如果我不迁移到较新版本的路由器，一切都会加载，但我会收到许多与 angular-ui-router 相关的错误：

Error: transition superseded
Error: transition prevented
Error: transition failed

我应该使用哪个版本的 Angular-ui-router 才能成功使 Angular 1.6.5 工作？

编辑 2：

可能与新的ui-router有关。问题出现在这里：

        $stateProvider
        .state({
            name: "root",
            "abstract": true,
            template: "<ui-view/>",
            resolve: {
                labelsResource: "labelsResource",
                codingSchemesResource: "codingSchemesResource",
                translation: function (labelsResource) {
                    return labelsResource.getLabels();
                },
                codingSchemesTranslation: function (codingSchemesResource) {
                    return codingSchemesResource.getCodingSchemes();
                }
            },
            controller: "RootController",
            controllerAs: "root"
        })

当它到达标签资源时，ui-router 会尝试执行以下操作：

// This effectively calls $get() on `$uiRouterProvider` to trigger init (when ng enters runtime)
runBlock.$inject = ['$injector', '$q', '$uiRouter'];
function runBlock($injector, $q, $uiRouter) {
services.$injector = $injector;
services.$q = $q;
// The $injector is now available.
// Find any resolvables that had dependency annotation deferred
$uiRouter.stateRegistry.get()
    .map(function (x) { return x.$$state().resolvables; })
    .reduce(unnestR, [])
    .filter(function (x) { return x.deps === "deferred"; })
    .forEach(function (resolvable) { return resolvable.deps = $injector.annotate(resolvable.resolveFn, $injector.strictDi); });
}

$injector.annote 代码失败：

function annotate(fn, strictDi, name) {
    var $inject, argDecl, last;

    if (typeof fn === 'function') {
        if (!($inject = fn.$inject)) {
            $inject = [];
            if (fn.length) {
                if (strictDi) {
                    if (!isString(name) || !name) {
                        name = fn.name || anonFn(fn);
                    }
                    throw $injectorMinErr('strictdi', '{0} is not using explicit annotation and cannot be invoked in strict mode', name);
                }
                argDecl = extractArgs(fn);
                forEach(argDecl[1].split(FN_ARG_SPLIT), function(arg) {
                    arg.replace(FN_ARG, function(all, underscore, name) {
                        $inject.push(name);
                    });
                });
            }
            fn.$inject = $inject;
        }
    } else if (isArray(fn)) {
        last = fn.length - 1;
        assertArgFn(fn[last], 'fn');
        $inject = fn.slice(0, last);
    } else {
        assertArgFn(fn, 'fn', true);
    }
    return $inject;
}

我不知道为什么。这适用于 angularjs 1.5.8 和 ui-router 0.2.14。

Answer 1

我通过一个类似的问题找到了我的问题的解决方案： angular-ui-router not resolving injected parameters

这不是同一个问题，但在看到上述问题的答案后，简单的解决方案终于击中了我。不敢相信它花了半天时间才让我明白......

我只需要像对任何其他功能（例如制作新模块时的功能）一样进行注入。

所以下面这段代码的解决方案：

resolve: {
    labelsResource: "labelsResource",
    codingSchemesResource: "codingSchemesResource",
    translation: function (labelsResource) {
        return labelsResource.getLabels();
    },
    codingSchemesTranslation: function (codingSchemesResource) {
        return codingSchemesResource.getCodingSchemes();
    }
}

是以下

 resolve: {
     labelsResource: "labelsResource",
     codingSchemesResource: "codingSchemesResource",
     translation: ["labelsResource", function (labelsResource) {
         return labelsResource.getLabels();
     }],
     codingSchemesTranslation: ["codingSchemesResource", function (codingSchemesResource) {
         return codingSchemesResource.getCodingSchemes();
     }]
 }