Question

我正在开发一个角度应用程序。在这个应用程序中，我需要添加一个路由处理程序来执行以下操作

1.听听/ app /：appid路线取决于appid参数，将一些文件从另一台服务器下载到此服务器。

文件看起来像这样

appid
|
|-html
|    |
|    ->index.html
|
|-javascript
     |
     ->app.js

HTML文件夹和java脚本文件夹可能有几个文件。但index.html文件肯定会在那里。

2.下载文件后，应该创建一个路由处理程序，如下所示

/appview/appid

指向刚刚下载的index.html文件。

我创建了下载文件的请求处理程序。它需要以下参数

localhost:port/requesthandler.ashx?appid=myappid

请求处理程序已经过测试并确认它正常运行。文件将下载到app/apps/appid文件夹。

然后我创建了route.config.js，如下所示

var app = angular.module('app');

app.constant('routes', getRoutes());


app.config(function ($provide) {

    $provide.provider("dataprovider", function () {
        return {
            $get: function ($http,$q) {
                return {
                    getData: function (appid) {
                        var defer = $q.defer();
                        $http.get('requestHandler.ashx?appid=' + appid).success(function (data) {

                            defer.resolve(data);

                        });
                        return defer.promise;
                    }
                };
            }
        };
    });
});

app.config(['$routeProvider', 'routes', 'dataprovider', routeConfigurator]);

function routeConfigurator($routeProvider, routes, dataprovider) {


    routes.forEach(function (r) {
        $routeProvider.when(r.url, r.config);
    });

    $routeProvider.when("/app/:appid", {
        redirectTo: function (routeParams, path, search) {
            $routeProvider.when("/appview/" + routeParams.appid, {
                templateUrl: 'app/apps/'+routeParams.appid+'/html/index.html',

            });


            dataprovider.getData(routeParams.appid);

            return "/appview/" + routeParams.appid;
        }
    });
    $routeProvider.otherwise({ redirectTo: '/dashboard' });
}


function getRoutes() {
    return [
        {
            url: '/dashboard',
            config: {
                templateUrl: 'app/dashboard/dashboard.html',
                title: 'dashboard',
                settings: {
                    nav: 1,
                    content: '<i class="fa fa-dashboard"></i> Dashboard'
                }
            }
        }
    ];
}

当我运行代码时，app停止并发出以下错误。

Uncaught object localhost:6406/scripts/angular.js:3809

angular.js文件中的特定行说明了这一点。

throw $injectorMinErr('modulerr', "Failed to instantiate module {0} due to:\n{1}",

但当我删除参数＆＃39; dataprovider＆＃39;从第二个配置，应用程序正常运行。但后来我无法使用dataprovider将文件下载到服务器。

删除＆＃39;数据提供者＆＃39;这条线看起来像这样。

app.config(['$routeProvider', 'routes',  routeConfigurator]);

function routeConfigurator($routeProvider, routes) {....

有谁能告诉我在这里我缺少什么？

Answer 1

您需要将提供商名称后缀为＆＃39; Provider＆＃39;字符串。

app.config(['$routeProvider', 'routes', 'dataproviderProvider', routeConfigurator]);

function routeConfigurator($routeProvider, routes, dataproviderProvider) {

}

请注意，dataprovider提供程序已注入config函数。此注入由提供程序注入器完成，该注入器与常规实例注入器不同，因为它仅实例化并连接（注入）所有提供程序实例。

为什么不能在angular配置中使用提供程序？

1 个答案: