Angular.js加载没有引用?

时间:2017-04-25 20:00:50

标签: javascript angularjs ajax

我正在进行逆向工程,这个用户界面可以减少一些错误。它以HTML,CSS和JavaScript编码,并通过REST API提取数据。用户界面是在Windows环境中设置的。

当我查看用户界面的index.html主页时,界面中使用了相当多的Angular.js,但是调用angular.js的脚本被注释掉了。我对于如何在没有被调用的情况下在服务器上运行angular.js感到困惑。有没有办法在服务器上引用或解析angular.js而不在HTML中引用它而不像通常那样调用它?

我很困惑。任何想法都会有所帮助。我在下面包含了index.html文件:

   <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width">
    <meta http-equiv="cache-control" content="no-cache, no-store"/>
    <meta http-equiv="expires" content="-1"/>
    <meta http-equiv="pragma" content="no-cache"/>
    <link rel="icon" href="content/images/favicon.png"/>
    <!--<script src="/bower_components/angular/angular.js"></script>
    <script src="/bower_components/jquery/dist/jquery.min.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap.min.js"></script>-->
    <!--<script src="/js/app.js"></script>-->
    <link rel="stylesheet" type="text/css" href="content/icomoon/style.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="content/css/bootstrap.css?0.0.0.164">
    <link rel="stylesheet" type="text/css"
          href="bower_components/bootstrap-dialog/dist/css/bootstrap-dialog.min.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="bower_components/jquery-ui/themes/base/jquery-ui.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="bower_components/angular-ui-grid/ui-grid.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="bower_components/spectrum/spectrum.css?0.0.0.164">
    <link rel="stylesheet" type="text/css"
          href="custom_components/eonasdan-bootstrap-datetimepicker/css/bootstrap-datetimepicker.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="bower_components/slick-carousel/slick/slick.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="bower_components/slick-carousel/slick/slick-theme.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="custom_components/loader-display/loadDisplay.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="content/css/keyboard.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="content/css/noty.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="custom_components/ladda-bootstrap/ladda-themeless.css?0.0.0.164">
    <link rel="stylesheet" type="text/css" href="content/css/daikin_mis_hmi.css?0.0.0.164">
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <!-- if logged in-->
            <button ng-if="!isHideMainControls" type="button" class="navbar-toggle" data-toggle="collapse"
                    data-target=".navbar-collapse">
                <span class="sr-only">ToggleNav</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" ng-click="goHome()">
                <img src="content/images/logo.png">
            </a>
            <span ng-if="!isHideMainControls" class="visible-xs visible-sm" alarm-indicator></span>
            <span ng-if="!isHideMainControls" class="visible-sm" dm-keyboard-widget></span>
            <span ng-if="!isHideMainControls" class="visible-xs visible-sm" network-mode></span>
        </div>

        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li class="hidden-xs hidden-sm"><span
                        ng-if="!isHideMainControls" network-mode></span></li>
                <li class="hidden-xs hidden-sm">
                    <span ng-if="!isHideMainControls" alarm-indicator></span>

                    <div dm-keyboard-widget></div>
                </li>
                <!-- if logged in-->
                <li class="divider-vertical hidden-xs hidden-sm"></li>
                <li ng-class="{'display-none': !isApplicationLoaded}" class="display-none">
                    <div ng-cloak class="logged-in-user-info" data-toggle="">
                        <div class="user-name">
                            {{sessionUser.firstName}} {{sessionUser.lastName}}
                        </div>
                        <div ng-if="!isHideMainControls" ng-hide="sessionUser.isGuest" class="log-out">
                            <a ng-click="logout();" href="#"><span class="glyphicon glyphicon-log-out"></span>{{generalLabels.genlogout}}</a>
                        </div>
                        <div ng-show="sessionUser.isGuest" class="log-out">
                            <a ui-sref="login" href="#"><span class="glyphicon glyphicon-log-out"></span>{{generalLabels.genlogin}}</a>
                        </div>
                    </div>
                </li>
                <li class="visible-xs visible-sm dropdown">
                    <ul class="submenu" ng-include src="'views/shared-templates/main-menu-items.html'">
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</div>

<div class="main-wrapper">
    <dm-main-menu class="hidden-block-xs hidden-block-sm"></dm-main-menu>
    <div style="display: none" id="appFailedLoadMessage"></div>
    <div class="wrap-loader" ng-hide="isApplicationLoaded">
        <div id="load-background" class="show-background">
            <div class="loading-display">
                <img class="ajax-loader" src="custom_components/loader-display/img/ajax-loader.gif">
                <br>

                <div class="display-none">
                    <img src="content/images/noty/ErrorMessageBackground.png" width="1" height="1" alt=""/>
                    <img src="content/images/noty/SuccessBackground.png" width="1" height="1" alt=""/>
                    <img src="content/images/noty/accept.png" width="1" height="1" alt=""/>
                    <img src="content/images/noty/error_ico.png" width="1" height="1" alt=""/>
                    <img src="content/images/noty/wrong.png" width="1" height="1" alt=""/>

                    <img src="content/images/control-buttons/on_off1.png" width="1" height="1" alt=""/>
                    <img src="content/images/control-buttons/on_off2.png" width="1" height="1" alt=""/>
                    <img src="content/images/control-buttons/switcher1.png" width="1" height="1" alt=""/>
                    <img src="content/images/control-buttons/switcher2.png" width="1" height="1" alt=""/>
                </div>
                <span></span>
            </div>
        </div>
    </div>

    <!-- BreadCrumbs go here-->
    <div ng-if="!isHideMainControls" class="breadcrumbs">
        <div class="container">
            <div ncy-breadcrumb></div>
        </div>
    </div>

    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div ui-view></div>
            </div>
        </div>
    </div>
</div>

<a href="#" class="go-top"><i class="icon-arrow-up icon-large"></i> {{generalLabels.gentop}}</a>

<div class="footer">
    <div class="container">
        <div class="row">
            <div class="col-sm-4 hidden-xs visible-sm visible-md visible-lg text-center-xxs text-center-xs text-left-sm text-left-md text-left-lg">
                <!-- Easter Egg - footer double click show current viewport size and version -->
                <span class="js-ui-version" style="display:none"></span>
                <span class="js-viewport-size" style="display:none"></span>
            </div>
            <div ng-class="{'display-none': !isApplicationLoaded}"
                 class="display-none col-sm-4 hidden-xs visible-sm visible-md visible-lg text-center-sm text-center-md text-center-lg">
                <a target="_blank" ng-href="{{daikinAppliedLink.url}}">{{daikinAppliedLink.text}}</a>
            </div>

            <div ng-class="{'display-none': !isApplicationLoaded}"
                 class="display-none col-sm-4 visible-xs hidden-sm hidden-md hidden-lg text-center-xxs text-center-xs">
                <a target="_blank" ng-href="{{daikinAppliedLink.url}}">{{daikinAppliedLink.text}}</a>
            </div>

            <div class="col-sm-4 visible-xs hidden-sm hidden-md hidden-lg text-center-xxs text-center-xs">
                <!-- Easter Egg - footer double click show current viewport size and version -->
                <span class="js-ui-version" style="display:none"></span>
                <span class="js-viewport-size" style="display:none"></span>
            </div>
        </div>
    </div>
</div>
<script src="../bower_components/fastclick/lib/fastclick.js?0.0.0.164"></script>
<script src="bower_components/requirejs/require.js"></script>
<script>

    if ('addEventListener' in document) {
        document.addEventListener('DOMContentLoaded', function () {
            FastClick.attach(document.body);
            //todo workaround fixes the problem with selecting a date on the calendar
            FastClick.prototype._needsClick = FastClick.prototype.needsClick;
            FastClick.prototype.needsClick = function (target) {

                if ($(target).parents('.bootstrap-datetimepicker-widget').length > 0) {
                    return true;
                }
                return FastClick.prototype._needsClick.call(this, target);
            };
        }, false);
    }

    var scriptsLoadTimeoutSeconds = 60;

    require.config({
        waitSeconds: scriptsLoadTimeoutSeconds,
        baseUrl: './js',
        urlArgs: '0.0.0.164'
    });

    require(["./main"]);

    DisplayAppNotLoadedMessage = function () {
        document.getElementById('load-background').style.display = 'none';

        var errorMessageBlock = document.getElementById('appFailedLoadMessage');

        errorMessageBlock.style.display = 'block';
        errorMessageBlock.innerHTML = 'The system may be either busy or not currently running, please verify status locally at the System Manager PC or try again later.  If the problem persists, refer to IM 1224 for more detailed troubleshooting procedures.';
    };

    // show error message in case of any resources are not loaded
    LoadTimeoutId = setTimeout(function () {
        DisplayAppNotLoadedMessage();
    }, (scriptsLoadTimeoutSeconds + 30) * 1000);
    </script>
    </body>
    </html>

1 个答案:

答案 0 :(得分:0)

我明白了。 index.html文件调用Require.JS,它允许您将脚本异步加载到主页,但在跟踪依赖项时会产生一些问题。它是一个JavaScript框架,基本上允许您异步加载整个JavaScript文件夹。