当方法影响作用域元素时的Angular服务设计

Angular service design when methods affect scope elements

本文关键字：Angular 服务 方法 影响 作用域 元素      更新时间：2023-09-26

我有这个jsfiddle，基本上是两个按钮的应用程序。当你点击第一个时，它在我的角控制器(load())中执行一个方法，我试图创建服务来重用逻辑，组织更多的代码，并实际尝试遵循最佳实践。

首先请让我知道我的理解是否正确。

  1. 控制器是与模型沟通更改的部分，是我的视图或表示与应用程序背后的逻辑之间的交互。

  2. Service更多的是用来创建在应用中运行的进程，从REST的角度来看，这将负责调用REST api，如果计算应用，这是它们应该驻留的地方。

我的问题是，当http调用的回调函数移动范围内的元素并用于在UI中执行操作时，我该怎么办?

将$scope移到我的服务层是正确的吗?，我认为这是正确的，原因如下。

给出一个真实的例子，将load()方法逻辑移动到loadFromService方法的最佳方法是什么，我如何发送我需要更新UI的信息，在这种情况下[source]和[invalid]变量。

基于我想更新源变量与"服务"值和无效=真，当我调用它使用myService.loadFromService();

做那件事的正确方法是什么?澄清一下，我想要相同的结果如果我点击执行控制器方法的第一个按钮或者点击调用服务的第二个按钮，正确的实现是什么

Update:如果我在REST调用之前和之后有一系列条件或规则，我的意思是服务方法不仅执行REST调用(做一些逻辑来设置输入参数，并对响应做一些事情)

正确的方法是返回一个承诺。

你可以阅读更多关于这篇文章:在服务

中处理$http响应

所以我将像这样实现它:

myApp.service('myService', [ '$http', function($http) {
    this.loadFromService = function() {
        $http.get('http://localhost:8080/person').then( function(res) {
            return res.data;
        });
    };
}]);

在控制器中你可以输入:

myApp.controller('myController', ['myService', function(myService) {
    $scope.load = function() {
        myService.loadFromService().then(function(data) {
            $scope.data2 = data;
        });
    };
}]);
相关文章：