Javascript AngularJS不允许通过requireJS访问外部函数

我正在使用另一个JavaScript文件中的函数。我一直在犯这个错误：

TypeError: lightFn.hextoRGB is not a function
    at lightPage.js:17
    at Scope.$digest (angular.js:16664)
    at Scope.$apply (angular.js:16928)
    at done (angular.js:11266)
    at completeRequest (angular.js:11464)
    at XMLHttpRequest.requestLoaded (angular.js:11405)

我正在运行AngularJS1.5。以下是HTML页面的后端JS代码：

'use strict';
(function($) {
angular.module('careApp.lightPage', ['ngRoute', 'farbtastic'])

.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/lightPage', {
    templateUrl: './lightPage/lightPage.html',
    controller: 'lightPageCtrl'
  });
}])

.controller('lightPageCtrl', ['$scope', function($scope) {
    //require() call for external script, located in another folder
    var lightFn = require(['../client_scripts/lights/lights.js']);
    $scope.color = "#123456";
    //watches $scope.color for any changes. On change, run the function.
    $scope.$watch('$scope.color', function(){
        console.log("Sending " + $scope.color + " to lighting board.");
        lightFn.hextoRGB($scope.color);
    });
}]);
})(jQuery);

根据我得到的错误，我猜测：

• 我编写的

  require（）

  无法正常工作
• AngularJS中的某些内容阻止我使用

  require（）

---

任何帮助都将不胜感激。

这不是您使用

require（）

的方式

require（）

接受两个参数，一个依赖项的

Array

，以及一个

函数

，用加载的依赖项作为参数进行调用

require([
    // Provide an array of dependencies you need
    "one/of/my/deps",
    "another/dep"
], function (
    // Your dependencies will be loaded into the arguments of your callback
    oneOfMyDeps,
    anotherDep
) {
    // Your dependencies are available here
    oneOfMyDeps.foo();
    anotherDep.bar();
});

您正试图将

require（）

的返回值存储在

lightFn

中。但是，

require（）

在这方面并没有真正返回任何有用的信息。您需要在给

require（）

的回调中使用do-your操作加载的依赖项。您可以在下面看到正确的用法

require(['../client_scripts/lights/lights.js'], function (lightFn) {
    $scope.color = "#123456";
    //watches $scope.color for any changes. On change, run the function.
    $scope.$watch('$scope.color', function () {
        console.log("Sending " + $scope.color + " to lighting board.");
        lightFn.hextoRGB($scope.color);
    });
});

---

还值得注意的是，AngularJS与AMD（require.js）在依赖注入方面使用的概念类似。然而，签名却有着奇怪的不同。事实上，您已经在当前应用程序中使用了它。阅读关于AngularJS的文章

在AngularJS中，签名只是一个数组，其依赖项字符串的顺序后跟一个具有依赖项对象参数的

函数。正如我所说，这与AMD非常相似，不同之处在于回调是依赖数组的最后一个成员

app().config([
    // Deps are in array similar to AMD
    "some/dep",
    "some/other/dep",
    // Callback is last member of array
    function (
        // Dep objects are still arguments of callback
        someDep,
        someOtherDep
    ) {
        domDep.fizz();
        someOtherDep.buzz();
}]);


这与实际情况不同。在commonjs中，
require（）
实际上返回一些内容。如果您熟悉
node.js
，它们将共享使用详细信息

不同之处在于实现了JavaScript规范而不是commonjs规范，这使得它是异步的，因此您不必等待所有模块加载后才能执行任何操作。两者都有优点和缺点，但这超出了问题的范围。
不需要括号
[]
，在
lights.js
中是否有导出？@ryan0319如果提问者确实在使用，则需要
[]
。此
require（）
与one node.js或任何其他commonjs spec fallows不同，因为它是AMD。@zero298你说得对，我的错。这肯定有帮助，但我现在遇到的另一个错误超出了我自己问题的范围。不过，我会把你的答案标记为完整！
app().config([
    // Deps are in array similar to AMD
    "some/dep",
    "some/other/dep",
    // Callback is last member of array
    function (
        // Dep objects are still arguments of callback
        someDep,
        someOtherDep
    ) {
        domDep.fizz();
        someOtherDep.buzz();
}]);