添加第三方供应商的依赖，以mean.js [英] Adding third party vendor dependencies to mean.js

问题描述

我一直在努力试图挂钩这种依赖性（ http://flowjs.github.io / NG-流量/ ）我mean.js应用。我想这是一个简单的命名问题。

我得到的错误是：错误：[$喷油器：unpr]未知提供商：flowProvider＆LT; - 流程

我试过'流动'，'流'，'ngFlow'等任何帮助将大大AP preciated。

模块/核心/客户/应用/ config.js

 使用严格的;//初始化为AngularJS应用程序的应用配置模块
VAR ApplicationConfiguration =（函数（）{
    //初始化模块的配置选项
    VAR applicationModuleName ='平均';
    变种applicationModuleVendorDependencies = ['ngResource'，'ngAnimate'，'ui.router'，'ui.bootstrap'，'ui.utils'，'angularFileUpload'，'流'];    //添加一个新的垂直模块
    VAR registerModule =功能（MODULENAME，依赖）{
        //创建角模块
        angular.module（模块名，依赖|| []）;        //将模块添加到AngularJS配置文件
        angular.module（applicationModuleName）.requires.push（MODULENAME）;
    };    返回{
        applicationModuleName：applicationModuleName，
        applicationModuleVendorDependencies：applicationModuleVendorDependencies，
        registerModule：registerModule
    };
}）（）;
模块/属性/客户/ properties.client.controller.js：
使用严格的;变量$ = $ || {};//属性控制器
angular.module（属性）。控制器（'PropertiesController'，[
  '$范围'，
  '$ stateParams'，
  '$位置'，
  认证，
  '品牌'，
  应用程序，
  '属性'，
  '流'，    功能（$范围，$ stateParams，$位置，认证，品牌​​，应用，性能，流）{.......
 

模块/属性/客户/ properties.client.module.js：

 使用严格的;//使用广告应用程式配置模块注册一个新的模块
//ApplicationConfiguration.registerModule('properties'）;
ApplicationConfiguration.registerModule（'属性'，['流']）;
 

配置/资产/ default.js：

使用严格;

  module.exports = {
    客户端：{
        lib目录下：{
            CSS：
                公共/ lib目录/引导/距离/ CSS / bootstrap.css'，
                公共/ lib目录/引导/距离/ CSS /引导-theme.css
            ]
            JS：
                公共/ lib目录/角/ angular.js'，
                公共/ lib目录/角资源/角resource.js'，
                公共/ lib目录/角动画/角animate.js'，
                公共/ lib目录/角UI路由器/发行/角-UI-router.js'，
                公共/ lib目录/角-UI-utils的/ UI-utils.js'，
                公共/ lib目录/角引导/ UI的引导-tpls.js'，
                公共/ lib目录/角文件上传/角文件upload.js'，
                公共/ lib中/ jQuery的/距离/ jquery.js和'
        公共/ lib目录/ NG-流量/距离/ NG-流standalone.js
            ]
            测试：['公共/ lib目录/角嘲笑/角mocks.js']
        }，
        CSS：
            模块/ * /客户/ CSS / *。CSS
        ]
        减： [
            模块/ * /客户/更少/ *。少
        ]
        青菜：
            模块/ * /客户/ SCSS / *。SCSS
        ]
        JS：
            模块/核心/客户/应用/ config.js'，
            模块/核心/客户/应用/ init.js'，
            模块/ * /客户/ *。JS'，
            模块/ * /客户/ ** / *。JS
        ]
        观点：'模块/ * /客户/视图/ ** / * HTML']
    }，
    服务器：{
        allJS：['。配置/ ** / * JS''gruntfile.js'，'server.js'，'模块/ * /服务器/ ** / * JS']，
        型号：'模块/ * /服务器/型号/ ** / * JS'，
        路线：['！模块/ * [核心] /服务器/路由/ ** / * JS'，'模块/核心/服务器/路由/ ** / * JS']，
        插座：'模块/ * /服务器/插座/ ** / * JS'，
        配置：'模块/ * /服务器/配置/ * JS'，
        政策：模块/ * /服务器/政策/ * JS。，
        观点：'模块/ * /服务器/视图/ * HTML
    }
};
 

解决方案

只要您加载的JS文件正确，则可以使用 flowFactory 来创建一个流程实例。然后创建一个流对象，并用它来指流动。

  angular.module（属性）。控制器（'PropertiesController'，[
  '$范围'，
  '$ stateParams'，
  '$位置'，
  认证，
  '品牌'，
  应用程序，
  '属性'，
  flowFactory'，   功能（$范围，$ stateParams，$位置，认证，品牌​​，应用，性能，flowFactory）{$ scope.existingFlowObject = flowFactory.create（{
    目标：http://example.com/upload
}）;
.................................................. ..............
 

因此​​，尝试改变流量到 flowFactory 键，看看是否导致任何供应商的依赖问题。

I've been struggling trying to hook up this dependency (http://flowjs.github.io/ng-flow/) to my mean.js application. I'm thinking it's simply a naming problem.

The error I'm getting is: Error: [$injector:unpr] Unknown provider: flowProvider <- flow

I've tried 'flow', 'Flow', 'ngFlow', etc. Any help would be greatly appreciated.

modules/core/client/app/config.js

'use strict';

// Init the application configuration module for AngularJS application
var ApplicationConfiguration = (function() {
    // Init module configuration options
    var applicationModuleName = 'mean';
    var applicationModuleVendorDependencies = ['ngResource', 'ngAnimate', 'ui.router', 'ui.bootstrap', 'ui.utils', 'angularFileUpload', 'flow'];

    // Add a new vertical module
    var registerModule = function(moduleName, dependencies) {
        // Create angular module
        angular.module(moduleName, dependencies || []);

        // Add the module to the AngularJS configuration file
        angular.module(applicationModuleName).requires.push(moduleName);
    };

    return {
        applicationModuleName:                applicationModuleName,
        applicationModuleVendorDependencies:  applicationModuleVendorDependencies,
        registerModule:                       registerModule
    };
})();


modules/properties/client/properties.client.controller.js:
'use strict';

var $ = $ || {};

// Properties controller
angular.module('properties').controller('PropertiesController', [
  '$scope',
  '$stateParams',
  '$location',
  'Authentication',
  'Brands',
  'Applications',
  'Properties',
  'flow',

    function($scope, $stateParams, $location, Authentication, Brands, Applications, Properties, flow) {

.......

modules/properties/client/properties.client.module.js:

'use strict';

// Use applicaion configuration module to register a new module
//ApplicationConfiguration.registerModule('properties');
ApplicationConfiguration.registerModule('properties',['flow']);

config/assets/default.js:

'use strict';

module.exports = {
    client: {
        lib: {
            css: [
                'public/lib/bootstrap/dist/css/bootstrap.css',
                'public/lib/bootstrap/dist/css/bootstrap-theme.css'
            ],
            js: [
                'public/lib/angular/angular.js',
                'public/lib/angular-resource/angular-resource.js',
                'public/lib/angular-animate/angular-animate.js',
                'public/lib/angular-ui-router/release/angular-ui-router.js',
                'public/lib/angular-ui-utils/ui-utils.js',
                'public/lib/angular-bootstrap/ui-bootstrap-tpls.js',
                'public/lib/angular-file-upload/angular-file-upload.js',
                'public/lib/jquery/dist/jquery.js',
        'public/lib/ng-flow/dist/ng-flow-standalone.js'
            ],
            tests: ['public/lib/angular-mocks/angular-mocks.js']
        },
        css: [
            'modules/*/client/css/*.css'
        ],
        less: [
            'modules/*/client/less/*.less'
        ],
        sass: [
            'modules/*/client/scss/*.scss'
        ],
        js: [
            'modules/core/client/app/config.js',
            'modules/core/client/app/init.js',
            'modules/*/client/*.js',
            'modules/*/client/**/*.js'
        ],
        views: ['modules/*/client/views/**/*.html']
    },
    server: {
        allJS: ['gruntfile.js', 'server.js', 'config/**/*.js', 'modules/*/server/**/*.js'],
        models: 'modules/*/server/models/**/*.js',
        routes: ['modules/*[!core]/server/routes/**/*.js', 'modules/core/server/routes/**/*.js'],
        sockets: 'modules/*/server/sockets/**/*.js',
        config: 'modules/*/server/config/*.js',
        policies: 'modules/*/server/policies/*.js',
        views: 'modules/*/server/views/*.html'
    }
};

解决方案

So long as you loaded the js file correctly, you can use flowFactory to create a flow instance. Then create a flow object and use that to refer to flow.

angular.module('properties').controller('PropertiesController', [
  '$scope',
  '$stateParams',
  '$location',
  'Authentication',
  'Brands',
  'Applications',
  'Properties',
  'flowFactory',

   function($scope, $stateParams, $location, Authentication, Brands, Applications, Properties, flowFactory) {

$scope.existingFlowObject = flowFactory.create({
    target: 'http://example.com/upload'
});
................................................................

So try changing flow to flowFactory and see if that leads to any provider dependency issues.

这篇关于添加第三方供应商的依赖，以mean.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！