Question

我试图将现有代码分成不同的文件。我在js文件中声明了ng-app，如下所示：

 define(['routes-admin', 'services/dependencyResolverFor'], function (routes, dependencyResolverFor) {
        var app = angular.module('app', ['ngRoute', 'formly', 'xeditable', 'toaster', 'ngAnimate', 'ui.bootstrap']);
      app.config([
                '$routeProvider',
                '$locationProvider',
                '$controllerProvider',
                '$compileProvider',
                '$filterProvider',
                '$provide',
                '$httpProvider',

                function ($routeProvider, $locationProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, $httpProvider) {
                    app.controller = $controllerProvider.register;
                    app.directive = $compileProvider.directive;
                    app.filter = $filterProvider.register;
                    app.factory = $provide.factory;
                    app.service = $provide.service;
                    $httpProvider.interceptors.push('middleware');
                ])
        return app;
        });

和html代码是这样的：

<!DOCTYPE html>
<html >
<head>
    <meta charset="utf-8"/>
    <title>title</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/font-awesome.min.css" rel="stylesheet"/>
    <link href="css/style.css" rel="stylesheet"/>
    <link href="css/style-blue1.css" rel="stylesheet" id="style_color"/>
    <link href="css/jstree-themes/default/style.min.css" rel="stylesheet">
    <link href="lib/toaster/toaster.css" rel="stylesheet">
    <script type="text/javascript" src="lib/intro.js"></script>
</head>
<body ng-app="app">
<div id="navbar">

</div>
<div id="container">
    <button class="btn" ng-click="functions()">funvtions</button>
</div>
<script type="text/javascript" src="lib/require.js"></script>
<script type="text/javascript" src="lib/angular/angular.js"></script>
<script type="text/javascript" src="app/app.js"></script>
<script type="text/javascript" src="lib/angular/angular-route.min.js"></script>
<script type="text/javascript" src="lib/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="app/factories/MainViewFactory.js"></script>
<script type="text/javascript" src="app/controllers/MainViewController.js"></script>
<script type="text/javascript" src="lib/jstree.min.js"></script>
</body>
</html>

在脚本段中的

我包含app.js，它是上面的js文件。但是在运行代码之后，它会产生错误：无法实例化应用程序。

帮助我

Answer 1

当依赖关系未得到满足时的经典问题

<script type="text/javascript" src="app/app.js"></script>
<script type="text/javascript" src="lib/angular/angular-route.min.js"></script>

你在app之后加载了角度路由，因此依赖注入失败

虽然你应该在angular之前加载jQuery，然后angular.element将使用jQuery选择器

在角度js的单独文件中定义app

1 个答案: