在角度应用程序中加载织物 js答案

【问题标题】：load fabric js in angular application在角度应用程序中加载织物 js
【发布时间】：2014-11-27 17:00:27
【问题描述】：

所以我在我的 Angular 应用程序中使用 bower 下载并安装了 fabricjs，但我无法加载它。

我的 app.js 文件顶部有以下内容。除面料外，其他一切都很好

angular
 .module('myApp', [
   'flow',
   'fabric',
   'ngAnimate',
   'ngCookies',
   'ngResource',
   'ngRoute',
   'ngSanitize',
   'ngTouch',
   'ui.bootstrap',
   'ui.router',
   'controllers.main',
])
 .config( function ($stateProvider, $httpProvider, flowFactoryProvider ) {

当我加载页面时，我收到以下错误。

[$injector:modulerr] Failed to instantiate module fabric due to: [$injector:nomod] Module 'fabric' is not available! You either misspelled the module name or forgot to load it.

我正在将它加载到我的 index.html 中

<script src="bower_components/fabric/dist/fabric.min.js"></script>

任何人在他们的角度应用程序中加载织物有任何成功吗？

【问题讨论】：

标签： javascript angularjs html5-canvas fabricjs

【解决方案1】：

尽管这很旧，但我会尝试为将来的搜索者回答。

我在 Angular 中使用 Fabric 取得了巨大成功。

从我在您的代码示例中可以看到，您正在尝试将标准 fabic.min.js 文件用作 Angular 模块。 Angular 只将其视为纯 JS，这就是为什么它会生成一个错误说它找不到它 - 因为没有一个名为“fabric”的 Angular 模块被声明为：

angular.module('fabric', []);

如果您比较您列出的其他模块之一，例如 ngCookies，您可以看到一个是如何设置的。

在这里发布的代码太多了，所以最简单的解决方案是利用或研究 Michael Calkins 的一些优秀作品：

https://github.com/michaeljcalkins/angular-fabric

他将所有内容都包含在指令中，这使得它易于实施。

你也可以在这里玩它：http://codepen.io/michaeljcalkins/pen/Imupw

希望对某人有所帮助。

【讨论】：