如何在 AngularJS 1.2.20 中使用 AngularJS Material

Question

我尝试在我的 AngularJS 1.2.20 项目上安装最新的 AngularJS Material 版本和 Getting Started 指南。（我知道它很旧，但我无法更新）

Failed to instantiate module app due to:
Error: [$injector:modulerr] http://errors.angularjs.org/1.2.20/$injector/modulerr?p0=...
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:6:450
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:34:97
    at Array.forEach ()
    at q (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:7:280)
    at e (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:33:207)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:33:284
    at Array.forEach ()
    at q (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:7:280)
    at e (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:33:207)
    at dc (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js:36:309

我不知道为什么，但我找不到任何版本兼容的列表...

也许有人有想法？

这就是我在 <head>

中包含 js 文件的方式

<!-- Angular Material Library -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.8/angular-material.min.js"></script>

这是我的 angular.module:

var app = angular.module('app', [
    'ngMaterial',
    'ui.bootstrap',
    'ngCookies',
    'ngResource',
    'ngSanitize',
    'ngRoute',
    'infinite-scroll',
    'rzModule',
    'ngReallyClickModule',
    'ngVideoCutModule',
    'ngVideoTrailerModule',
    'ngItemModules',
    'ngDirectives',
    'xeditable',
    'monospaced.elastic',
    'angularFileUpload',
    'angulartics',
    'angulartics.google.analytics',
    'angular-video',
    'checklist-model',
    'ui-notification',
    'luegg.directives',
    'ngLoadingModule'
]);

包含 JS 文件的顺序：

<script src="/inc/assets/js/modernizr.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular-sanitize.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular-resource.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular-cookies.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular-route.js"></script>

<script src="/inc/js/app/application.js"></script>
<script src="/inc/js/app/app.routes.js"></script>
<script src="/inc/js/app/app.config.js"></script>

<!-- Angular Material Library -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.8/angular-material.min.js"></script>

Answer 1

关于问题评论中的讨论，我认为你的错误是你在加载 AngularJS 脚本之前声明了你的应用程序（和你的控制器）。

我建议你这样做：

<html>
  <script src="angular.js"></script>
  <script src="app.js"></script>

  <body ng-app="app">
    <div ng-controller="MainCtrl">
    </div>
  </body>
</html>

首先加载 AngularJS，然后是您的自定义脚本，并声明您的应用程序（在视图中），然后是您的控制器。

Answer 2

如 bower.json and package.json AngularJS 中所示，1.4 是我们最新版本正式支持的最旧版本。实际情况是建议使用 1.5+。我们很快就会升级到 1.6。

请注意，1.2.20 于 2014 年 7 月 11 日发布，缺少许多安全补丁。如果您必须使用 1.2.x，您至少应该使用 1.2.32，其中包括修复程序和安全补丁并于 2016 年 10 月 11 日发布。

我强烈建议升级到最新的 AngularJS 1.6，因为 1.7 将于今年夏天推出，并将包含 LTS。您会希望您的活动项目在 LTS 上向前发展，因为关键修复和安全补丁将仅应用于 AngularJS 1.7.x.

如何在 AngularJS 1.2.20 中使用 AngularJS Material

How to use AngularJS Material with AngularJS 1.2.20

angularjs

angularjs-material