AngularJS项目结构和定义

时间:2016-02-18 15:02:03

标签: angularjs angularjs-scope

在app.js文件中,我定义了以下内容:

var app = angular.module("app", ["ngRoute"]);

在testController.js中我定义了以下内容:

app.controller('testController', ['$scope'], function($scope) {
    $scope.temp1 = "";
    $scope.temp2 = -1;
});

在testService.js中我定义了以下内容:

app.factory('testService', function ($http, $scope) {
    'use strict';
    return {        
        list: function (callback) {
            $http.get('url?param=' + $scope.temp1).success(callback);
        }
    };
});

在testController.js和testService.js中,lint告诉我app未定义。如何从app.js告诉应用程序是app的两个文件?

我如何告诉testService.js $ scope.temp1实际上来自testController.js?

由于

1 个答案:

答案 0 :(得分:1)

首先,所有代码都应该包含在一个立即调用的函数表达式中。

https://github.com/johnpapa/angular-styleguide#iife

(function(){
    real code goes here
})();

这使全局变量空间保持清洁

要从其他代码访问应用程序,您不要......再次检索它。所以你的控制器看起来像这样:

(function(){
    angular.module("app").controller("testController", ....
})();

最后,代码的控制器部分放错了括号。结束]应该在函数之后。

(function(){
    angular.module("app").controller("testController", ['$scope',function($scope){
        // function code here
    }]
})();

你的服务是一个单例(整个app只有一个。所以,你不会像你一样将范围传递给构造函数,但你会将它传递给需要访问它的函数。

但是将范围传递给类似的服务可能会将您的控制器紧密地耦合到您的服务,这是您不应该做的事情。您应该从服务中检索并传递需要的特定元素,而不是可能更改的范围。