Node.js 角度控制器和服务_Node.js_Angularjs_Web_Mean Stack

Node.js 角度控制器和服务

node.js angularjs web

Node.js 角度控制器和服务,node.js,angularjs,web,mean-stack,Node.js,Angularjs,Web,Mean Stack,我对web开发人员和AngularJS非常陌生。我正在尝试了解如何使用服务，并遵循本教程：服务如何与控制器连接？这是隐含的吗？我知道您可以将服务注入控制器，但在本教程中是如何实现的？您可以将服务注入控制器。这样地。服务背后的原因是您希望控制器尽可能“瘦”。所有繁重的逻辑/请求都应外包给服务部门 app.service('myService', function(){ this.name = 'Tyler'; } app.controller('myCtrl', function($sco

我对web开发人员和AngularJS非常陌生。我正在尝试了解如何使用服务，并遵循本教程：

服务如何与控制器连接？这是隐含的吗？我知道您可以将服务注入控制器，但在本教程中是如何实现的？

您可以将服务注入控制器。这样地。服务背后的原因是您希望控制器尽可能“瘦”。所有繁重的逻辑/请求都应外包给服务部门

app.service('myService', function(){
  this.name = 'Tyler';
}

app.controller('myCtrl', function($scope, myService){
  $scope.name = myService.name;
}

使用服务的另一个好处是可以将该服务注入多个控制器。一个很好的例子是，如果您有一个发出HTTP请求的服务。您可以简单地创建一个执行请求的服务，并将该服务注入到您需要该功能的每个控制器中，而不是在每个控制器中重新创建相同的代码来发出请求

编辑：回答您的问题。您需要确保将服务放置在同一“模块”上的控制器中。意思在你的HTML中你有这样的东西

<body ng-app="myApp">

var app = angular.module('myApp', []);

请注意，angular.module接受两个参数。您正在告诉angular创建一个名为“myApp”的新应用程序（与您的HTML一致）

然后在控制器、服务、指令文件的顶部会有类似的内容

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

请注意，这一个只接受一个参数，即应用程序的名称。你告诉angular，你不是在创建一个新的应用程序，而是在“获取”你已经构建的应用程序。然后，你将把你的控制器、指令、服务粘贴到这个应用上，只要这些东西在同一个应用上，你就可以注入它们

对您的评论进行另一次编辑

在教程中，他们做的有点奇怪。他们正在为每个控制器、服务等创建新模块。这还不错，只是有所不同。这样做让我困惑，所以我更喜欢把所有东西都放在一个模块下。在本教程中，这是将所有内容粘合在一起的线条

// public/js/app.js
angular.module('sampleApp', ['ngRoute', 'appRoutes', 'MainCtrl', 'NerdCtrl', 'NerdService', 'GeekCtrl', 'GeekService']);

他们有一个示例应用程序，然后他们构建的所有其他模块都被注入到主示例应用程序中

服务意味着可以从所有控制器访问，服务是一个构造函数，每个控制器都可以读取或写入服务，为了使用服务，您必须以以下方式调用服务：

var app = angular.module('myApp', []);

app.service('sharedProperties', function() {
    var stringValue = 'test string value';
    var objectValue = {
        data: 'test object value'
    };

    return {
        getString: function() {
            return stringValue;
        },
        setString: function(value) {
            stringValue = value;
        },
        getObject: function() {
            return objectValue;
        }
    }
});

app.controller('myController1', function($scope, sharedProperties) {
    $scope.setOnController1 = function(sharedPoperties){
    $scope.stringValue = sharedProperties.getString();
    $scope.objectValue = sharedProperties.getObject().data;
    }
});

app.controller('myController2', function($scope, sharedProperties) {
    $scope.stringValue = sharedProperties.getString;
    $scope.objectValue = sharedProperties.getObject();
    $scope.setString = function(newValue) {
        $scope.objectValue.data = newValue;
        sharedProperties.setString(newValue);
    //some code to set values on screen at controller1
    };

});

这是JS小提琴

因此，在本教程中，他将服务和控制器放在不同的文件夹中。要将服务注入控制器，服务和控制器是否需要位于同一文件中？此外，例如，在GeekCtrl.js中，注入发生在哪里？我看不到GeekService在其中使用。编辑我的答案以回答您的问题@苏布里克托克。因此，在教程中，服务被隐式地注入到app.js文件中的控制器中？再次编辑@苏布里奎托克。程序如何知道GeekCtrl.js与GeekService.js相对应？我很确定，因为您使用的是服务而不是工厂，所以您需要将方法固定在“this”上，而不是返回对象。