向mean.io应用程序中添加angular-material

Question

向mean.io应用程序中添加angular-material

4

我正在尝试将angular-material添加到一个mean.io应用程序中。

在我的自定义包中，我使用了bower安装了angular-material，现在我有了一个.../public/assets/lib/angular-material文件夹。

到目前为止都很好。现在我想在我的自定义mean.io模块中使用它，根据他们的文档，我已经添加了：

MyPackage.angularDependencies(['ngMaterial']);

在我的app.js文件中。

我也聚合了angular-material.css和angular-material.js（不确定是否需要这样做）。

但是，我遇到了以下错误：

Failed to instantiate module mean due to:
Error: [$injector:modulerr]     http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=m...)
at Error (native)
at http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:6:416
at http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:38:391
at n (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:7:333)
at g (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:37:488)
at http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:38:134
at n (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:7:333)
at g (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:37:488)
at eb (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:41:249)
at c (http://127.0.0.1:3001/bower_components/angular/angular.min.js?v=90fb950dbc3e9296755d9cc23a211744:19:463

我猜测是因为找不到angular-material模块，所以需要在某个地方指定其路径。但我无法确定具体位置。

- tkarls

你的 index.html 文件中有没有在你的脚本之前，在 angular.js 之后包含 angular-material.js？ - Sim

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Henrique Rotava · Accepted Answer

我遇到了同样的问题，这是由于angular未能解决一些material所需的库而导致的。我没有深入研究此问题，但我找到了一种备选方案，如下所述：

导航到项目根目录，然后使用bower安装angular material：

$ bower install angular-material --save

然后，进入项目根目录，您将找到包含AngularJS的/config/assets.json文件，现在您可以像这样添加angular material库：

{
  "core": {
    "css": {
      "bower_components/build/css/dist.min.css": [
        "bower_components/angular/angular-csp.css",
  ->    "bower_components/angular-material/angular-material.css",
        "bower_components/angular-ui-select/dist/select.min.css"
      ]
    },
    "js": {
      "bower_components/build/js/dist.min.js": [
        "bower_components/jquery/dist/jquery.min.js",
        "bower_components/angular/angular.min.js",
    ->  "bower_components/angular-aria/angular-aria.js",
    ->  "bower_components/angular-animate/angular-animate.js",
    ->  "bower_components/angular-material/angular-material.js",
        "bower_components/angular-mocks/angular-mocks.js",
        "bower_components/angular-cookies/angular-cookies.min.js",
        "bower_components/angular-resource/angular-resource.min.js",
        "bower_components/angular-sanitize/angular-sanitize.min.js",
        "bower_components/angular-ui-router/release/angular-ui-router.min.js",
        "bower_components/angular-jwt/dist/angular-jwt.min.js",
        "bower_components/angular-bootstrap/ui-bootstrap-tpls.js",
        "bower_components/angular-ui-select/dist/select.min.js",
        "bower_components/web-bootstrap/index.js"
      ]
    }
  }
}

我知道mean.io的说法是不要更改核心包，但我没有找到其他解决方法，如果有更好的解决方案，请告诉我们。