Question

我将ngRoute注入模块时收到错误。或者也许完全是在其他地方。我在控制台窗口中收到的错误链接到https://docs.angularjs.org/error/下面的这个网站$ injector / modulerr？p0 = routingApp＆amp; p1 =错误：％20％5Bng：areq％5D％20http：％2F％2Ferrors.angularjs .ORG％2F1.5.8％2Fng％2Fareq％3Fp0％3Dfn％26P1％3Dnot％2520A％2520function％252C％2520got％2520string％0A％20％20％20％20个原子％20https：％2F％2Fajax.googleapis.com％ 2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular.min.js：6：412％0A％20％20％20％20原子％20SB％20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs ％2F1.5.8％2Fangular.min.js：23：18）％0A％20％20％20％20原子％％20Pa的20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1.5.8 ％2Fangular.min.js：23：105）％0A％20％20％20％20原子％20Function.cb $$注释％20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1 .5.8％2Fangular.min.js：200：148）％0A％20％20％20％20原子％20E％20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular .min.js：41：20）％0A％20％20％20％20原子％20Object.invoke％20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular.min的.js：41：243）％0A％20％20％20％20原子％20d中2％ 0（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular.min.js：39：418）％0A％20％20％20％20个原子％20https：％2F％2Fajax .googleapis.com％2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular.min.js：40：19％0A％20％20％20％20原子％20Q％20（HTTPS：％2F％2Fajax.googleapis.com％ 2Fajax％2Flibs％2Fangularjs％2F1.5.8％2Fangular.min.js：7：355）％0A％20％20％20％20原子％20克％20（HTTPS：％2F％2Fajax.googleapis.com％2Fajax％2Flibs％ 2Fangularjs％2F1.5.8％2Fangular.min.js：39：319

我一直在网上搜索这个问题的解决方案，但我找不到任何特别有用的东西。至少有助于解决这个问题。下面的代码是我的angular.js文件

        (function (angular) {
            'use strict';

            angular.module('routingApp', ['ngRoute'])
                   .controller('routeController', routeController)
                   .config('routeProvider', routeProvider);

            function routeProvider($routeProvider) {
                $routeProvider
                .when('/',{
                    templateUrl: 'index.html',
                    controller: 'routeController'
                })
                .when('/A', {
                    templateUrl: 'pageA.html'
                })
                .when('/B',{
                    templateUrl: 'pageB.html'
                });
            }

            function routeController() {
                var rc = this;
                rc.msg = 'Main Page';
            }

        })(angular);

我的Index.html文件

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.js"></script>
    <script src="js/angular.js"></script>

    <body ng-app="routingApp" ng-controller="homeController as hc">
        <h3>Angular Routing</h3>
            <div class="main">
                <div class="nav">
                    <input type="button" class="homeButton" value="home"><a href="#/"></a></input>
                    <input type="button" class="buttonA" value="A"><a href="#A"></a></input>
                    <input type="button" class="buttonB" value="B"><a href="#B"></a></input>
                </div>
                    <p>{{hc.msg}}</p>

                <div ng-view></div>
            </div>
    </body>

Answer 1

Config接受一个函数的参数，而不是像控制器声明那样的键值。这应该可以解决错误。我也看到它正在从homeController中读取msg，它不存在于你提供的代码中。更新相同以使用RouteController来使主页消息工作。这是解决方案。

＆＃13;

(function(angular) {
  'use strict';

  angular.module('routingApp', ['ngRoute'])
    .controller('routeController', routeController)
    //.config(routeProvider);

  function routeProvider($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'index.html',
        controller: 'routeController'
      })
      .when('/A', {
        templateUrl: 'pageA.html'
      })
      .when('/B', {
        templateUrl: 'pageB.html'
      });
  }

  function routeController() {
    var rc = this;
    rc.msg = 'Main Page';
  }


})(angular);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.js"></script>

<body ng-app="routingApp" ng-controller="routeController as rc">
  <h3>Angular Routing</h3>
  <div class="main">
    <div class="nav">
      <input type="button" class="homeButton" value="home">
      <a href="#/"></a>
      </input>
      <input type="button" class="buttonA" value="A">
      <a href="#A"></a>
      </input>
      <input type="button" class="buttonB" value="B">
      <a href="#B"></a>
      </input>
    </div>
    <p>{{rc.msg}}</p>


  </div>
</body>

＆＃13;

角度路由;错误：$ injector：modulerr模块错误

1 个答案: