Javascript 未能实例化应用程序模块。为什么？_Javascript_Html_Angularjs

Javascript 未能实例化应用程序模块。为什么？

javascript html angularjs

Javascript 未能实例化应用程序模块。为什么？,javascript,html,angularjs,Javascript,Html,Angularjs,当我尝试加载包含AngularJS代码的html页面时，Firefox开发者控制台中出现以下错误： Error: [$injector:modulerr] Failed to instantiate module bookApp due to: [$injector:nomod] Module 'bookApp' is not available! You either misspelled the module name or forgot to load it. If registering

当我尝试加载包含AngularJS代码的html页面时，Firefox开发者控制台中出现以下错误：

Error: [$injector:modulerr] Failed to instantiate module bookApp due to:
[$injector:nomod] Module 'bookApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Error: [$injector:modulerr] Failed to instantiate module bookApp due to:
[$injector:nomod] Module 'bookApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.11/$injector/nomod?p0=bookApp
minErr/<@http://localhost:8080/petclinic/js/lib/angular.js:63:12
module/<@http://localhost:8080/petclinic/js/lib/angular.js:1764:1
ensure@http://localhost:8080/petclinic/js/lib/angular.js:1688:38
module@http://localhost:8080/petclinic/js/lib/angular.js:1762:1
loadModules/<@http://localhost:8080/petclinic/js/lib/angular.js:4094:22
forEach@http://localhost:8080/petclinic/js/lib/angular.js:323:11
loadModules@http://localhost:8080/petclinic/js/lib/angular.js:4078:5
createInjector@http://localhost:8080/petclinic/js/lib/angular.js:4004:11
bootstrap/doBootstrap@http://localhost:8080/petclinic/js/lib/angular.js:1446:20
bootstrap@http://localhost:8080/petclinic/js/lib/angular.js:1467:1
angularInit@http://localhost:8080/petclinic/js/lib/angular.js:1361:5
@http://localhost:8080/petclinic/js/lib/angular.js:26111:5
trigger@http://localhost:8080/petclinic/js/lib/angular.js:2741:7
createEventHandler/eventHandler@http://localhost:8080/petclinic/js/lib/angular.js:3011:9

http://errors.angularjs.org/1.3.11/$injector/modulerr?p0=bookApp&p1=%5B%24injector%3Anomod%5D%20Module%20'bookApp'%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument.%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.3.11%2F%24injector%2Fnomod%3Fp0%3DbookApp%0AminErr%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A63%3A12%0Amodule%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1764%3A1%0Aensure%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1688%3A38%0Amodule%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1762%3A1%0AloadModules%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4094%3A22%0AforEach%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A323%3A11%0AloadModules%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4078%3A5%0AcreateInjector%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4004%3A11%0Abootstrap%2FdoBootstrap%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1446%3A20%0Abootstrap%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1467%3A1%0AangularInit%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1361%3A5%0A%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A26111%3A5%0Atrigger%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A2741%3A7%0AcreateEventHandler%2FeventHandler%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A3011%3A9%0A

请注意，当我单击

index.html

中的按钮时，Firefox开发者控制台中没有输出，因为模块尚未实例化如何解决此错误？

以下是

index.html

：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Find Book By ISBN</title>
<script type="text/javascript" src="bookController.js"></script>
</head>
<body ng-app="bookApp">

<div ng-controller="bookController">  
    <table>
        <tr>
            <td width=200>
                ISBN:<input type="text" ng-model="book.isbn" />
                <br>
                <button ng-click="findBook()">Find Book</button>
            </td>
            <td>
                ISBN: <span ng-bind="book.isbn"></span>
                <br/>
                Title: <span ng-bind="book.title"></span>
                <br/>
                Author: <span ng-bind="book.author"></span>
            </td>
        </tr>
    </table>
</div>

    <!-- build:js({app,.tmp}) scripts/main.js -->
    <script src="js/lib/angular.js"></script>
    <script src="js/lib/angular-resource.js"></script>
    <script src="js/lib/angular-ui-router.js"></script>
    <script src="js/lib/angular-ui-router-statehelper.js"></script>
    <script src="js/lib/angular-animate.js"></script>
    <script src="js/lib/angular-cookies.js"></script>
    <script src="js/lib/angular-storage.js"></script>
</body>
</html>

以下是Firefox控制台的完整堆栈跟踪：

Error: [$injector:modulerr] Failed to instantiate module bookApp due to:
[$injector:nomod] Module 'bookApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Error: [$injector:modulerr] Failed to instantiate module bookApp due to:
[$injector:nomod] Module 'bookApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.11/$injector/nomod?p0=bookApp
minErr/<@http://localhost:8080/petclinic/js/lib/angular.js:63:12
module/<@http://localhost:8080/petclinic/js/lib/angular.js:1764:1
ensure@http://localhost:8080/petclinic/js/lib/angular.js:1688:38
module@http://localhost:8080/petclinic/js/lib/angular.js:1762:1
loadModules/<@http://localhost:8080/petclinic/js/lib/angular.js:4094:22
forEach@http://localhost:8080/petclinic/js/lib/angular.js:323:11
loadModules@http://localhost:8080/petclinic/js/lib/angular.js:4078:5
createInjector@http://localhost:8080/petclinic/js/lib/angular.js:4004:11
bootstrap/doBootstrap@http://localhost:8080/petclinic/js/lib/angular.js:1446:20
bootstrap@http://localhost:8080/petclinic/js/lib/angular.js:1467:1
angularInit@http://localhost:8080/petclinic/js/lib/angular.js:1361:5
@http://localhost:8080/petclinic/js/lib/angular.js:26111:5
trigger@http://localhost:8080/petclinic/js/lib/angular.js:2741:7
createEventHandler/eventHandler@http://localhost:8080/petclinic/js/lib/angular.js:3011:9

http://errors.angularjs.org/1.3.11/$injector/modulerr?p0=bookApp&p1=%5B%24injector%3Anomod%5D%20Module%20'bookApp'%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument.%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.3.11%2F%24injector%2Fnomod%3Fp0%3DbookApp%0AminErr%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A63%3A12%0Amodule%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1764%3A1%0Aensure%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1688%3A38%0Amodule%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1762%3A1%0AloadModules%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4094%3A22%0AforEach%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A323%3A11%0AloadModules%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4078%3A5%0AcreateInjector%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A4004%3A11%0Abootstrap%2FdoBootstrap%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1446%3A20%0Abootstrap%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1467%3A1%0AangularInit%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A1361%3A5%0A%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A26111%3A5%0Atrigger%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A2741%3A7%0AcreateEventHandler%2FeventHandler%40http%3A%2F%2Flocalhost%3A8080%2Fpetclinic%2Fjs%2Flib%2Fangular.js%3A3011%3A9%0A

错误：[$injector:modulerr]未能实例化模块bookApp，原因是：
[$injector:nomod]模块“bookApp”不可用！您要么拼错了模块名，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。
http://errors.angularjs.org/1.3.11/$injector/nomod？p0=bookApp
miner/您的bookController.js
文件未包含在内，因此您只需在所有角度脚本标记之后链接它
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Find Book By ISBN</title>
</head>
<body ng-app="bookApp">

<div ng-controller="bookController">  
    <table>
        <tr>
            <td width=200>
                ISBN:<input type="text" ng-model="book.isbn" />
                <br>
                <button ng-click="findBook()">Find Book</button>
            </td>
            <td>
                ISBN: <span ng-bind="book.isbn"></span>
                <br/>
                Title: <span ng-bind="book.title"></span>
                <br/>
                Author: <span ng-bind="book.author"></span>
            </td>
        </tr>
    </table>
</div>

    <script src="js/lib/angular.js"></script>
    <script src="js/lib/angular-resource.js"></script>
    <script src="js/lib/angular-ui-router.js"></script>
    <script src="js/lib/angular-ui-router-statehelper.js"></script>
    <script src="js/lib/angular-animate.js"></script>
    <script src="js/lib/angular-cookies.js"></script>
    <script src="js/lib/angular-storage.js"></script>
    <script type="text/javascript" src="bookController.js"></script>
</body>
</html>


按ISBN查找图书
国际书号：


找书
国际书号：


标题：


作者：
您正在运行生成任务吗？因为看起来您的'bookController.js'文件没有被包括在内。@PabloVillosladaPuigcerber我不知道构建任务是什么。我更多的是一个后端开发人员，我对javascript和angular是全新的。你能详细说明一下吗？bookController.js
不包含在你的HTML中。你需要在所有角度文件之后添加它。@PabloVillosladaPuigcerber你提供了这个特定问题的答案。如果你想把它写下来作为一个答案，我很乐意把它标记为接受和+1。另一个用户提供了在您的解决方案之后可能出现的下游问题的答案，因此我也给了另一个用户+1。看起来他包括了它（在index.html
的顶部），但我怀疑在加载angular.js
之后他没有包括它是有问题的。谢谢你和+1。在我的例子中，我还将所有脚本标记移到了正文部分的顶部。