javascript - 如何在不同位置组织 angularjs 工厂/服务/配置/ Controller 文件?

标签 javascript angularjs factory

目前我有这样的结构:

index.html
>views
   login-view.html
   report-view.html
>JS
   config.js
   >controllers
       loginCtrl.js
       reportCtrl.js
   >factories
       firebaseRefFactory.js

在 config.js 中,我有模板的路由,以及 firebase 的注入(inject)等。 我可以正确使用 Controller ,但如果我尝试使用工厂,则会收到未捕获错误:[$injector:modulerr]

我的index.html

<head>
    <!-- STYLES-->
    <link rel="stylesheet" type="text/css" href="CSS/modifier.css">
    <link rel="stylesheet" type="text/css" href="CSS/base.css">
    <link rel="stylesheet" type="text/css" href="CSS/skeleton.css">
    <link rel="stylesheet" type="text/css" href="CSS/layout.css">
    <!-- ANGULAR -->
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.18/angular.min.js"></script>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
     <script src="JS/angular-ui-router.min.js"></script>
     <script src="https://cdn.firebase.com/js/simple-login/1.6.2/firebase-simple-login.js"></script>
    <!-- FIREBASE -->
    <script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
    <!-- ANGULARFIRE -->
    <script src="https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.js"></script>
    <!-- CONFIG -->
    <script src="JS/config.js"></script>
    <!-- FACTORIES -->
    <script src="JS/factories/firebaseRefFactory.js"></script>
    <!-- CONTROLLERS -->
    <script src="JS/controllers/login.js"></script>
    <script src="JS/controllers/reporte.js"></script>

</head>

我的config.js

angular.module('Demo', ['firebase','ui.router']).config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('login');

$stateProvider.
state('login', {
    url: '/login',
    templateUrl: 'VIEWS/login-view.html',
    controller: 'loginCtrl'
}).
state('report', {
    url: '/report',
    templateUrl: 'VIEWS/report-view.html',
    controller: 'reportCtrl',
}); }]);

我想在其中使用我的工厂的登录Ctrl

angular.module('Demo').controller('loginCtrl', ['$scope', 'firebaseRefFactory', function($scope, firebaseRefFactory){
alert(firebaseRefFactory.getRef()); }]);

我的工厂

angular.module('Demo').factory('firebaseRefFactory', ['', function(){
return function getRef(){
    var text = "132";
    return text;
} }]);

我尝试更改 html 文件中脚本的顺序,并将工厂注入(inject)配置文件中的 Angular 模块中。

最佳答案

angular.module('Demo').factory('firebaseRefFactory', ['', function(){
return function getRef(){
    var text = "132";
    return text;
} }]);

修改为:

angular.module('Demo').factory('firebaseRefFactory', function(){
return{
    getRef: function(){
        var text;
        text = '123';
        return text;
    }
    };
});

感谢 TheSharpieOne,本指南对我们很有用:https://github.com/johnpapa/angularjs-styleguide

关于javascript - 如何在不同位置组织 angularjs 工厂/服务/配置/ Controller 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25456045/

相关文章:

javascript - 将 TypeScript 文件内的 "function"调用为 HTML

javascript - 如何根据 Bootstrap 类的屏幕尺寸启用 <div class ="row"> 的 ng-click 操作?

java - 实例化工厂的对象的名称是什么?

java - Spring:委托(delegate)给自定义代理包装器进行接口(interface)注入(inject)

javascript - 使用 Angular 过滤器解码 HTML 实体

javascript - Axios promise 链接不起作用

javascript - 如何在刷新时显示来自 PHP 表单的随机文本和图像?

javascript - 如何编写此 Javascript 代码来显示/隐藏每个个人元素?

javascript - Angular Parse REST 工厂变量

javascript - 用于匹配重复字符的 RegExp