Angular如何以正确的方式从服务中设置范围变量？答案

【问题标题】：Angular how to set scope variable from service in right way?Angular如何以正确的方式从服务中设置范围变量？
【发布时间】：2014-10-27 09:12:12
【问题描述】：

我希望从服务方法返回值到作用域中，以便在模板中使用和处理。

但我发现，我不能在服务中使用范围。我可以使用 Rootscope，但我认为这不是正确的方法。

如何轻松地将价值从服务设置到范围？

感谢您的任何建议。

代码如下：

/**
      * Init autocomplete dropdown menu for project list
      */
     this.getProjectListForAutocomplete =  function (container, options) {
         $("#autocompleteProjects").kendoAutoComplete({
             dataSource :  {
                 type: "json",
                 serverFiltering: true,
                 transport: {
                     read: function (options) {
                         console.log("List");
                         console.log(options.data);

                         ApiService.doHttpRequest(
                             "POST",
                             $rootScope.apiBaseUrl + "gpsaddress/search",
                             requestParams
                         )
                             .success(function (data, status, headers, config) {

                                         break;
                                 }
                             })
                             .error(function (data, status, headers, config) {

                             });
                     }
                 }
             },
             dataTextField: "city"  ,
             dataValueField: "address.city",
             filter: "contains",
             minLength: 1,
             change  : function (e) {
                 console.log("change");
                 //console.log(e);
             },
             select  : function (e) {
                 console.log("select");
                 var dataItem = this.dataItem(e.item.index());
                 console.log(dataItem);
                 // Here i need set scope in controller
             }
         });
     };

【问题讨论】：

为什么不在服务中创建返回类型的方法并在控制器的范围内捕获返回值？
修改服务中的作用域对象将是一个糟糕的设计，因为控制器被要求与作用域交互，而服务旨在独立于用户界面和作用域
@AnikIslamAbhi 你能添加一些例子吗？我是 Angular 的新手。
先贴出你的代码

标签： javascript angularjs scope

【解决方案1】：

请看下面的演示：

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


app.service('dataService', function() {

  var _person = {

    name: "jack",
    surname: "doe"

  }

  return {
    person: _person

  }

})
app.controller('fCtrl', function($scope, dataService) {

  $scope.person = dataService.person;

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="fCtrl">
    <p>First Name: {{person.name}}</p>
    <p>Last Name: {{person.surname}}</p>
    Edit First Name:<input type: "text" ng-model="person.name" />
  </div>
</div>

【讨论】：

我更新了问题。想要设置范围值的代码是嵌套的。
@redrom 我有点困惑，你的控制器或服务的代码是什么？您想在哪个位置以及以哪种方式编辑变量？
是来自服务方法的代码。我需要将 JSON 对象返回到写入的范围内 //// 这里我需要在控制器中设置范围

【解决方案2】：

第一种方法：

服务中：

serviceMethod: functon(scope){
   //processing
   scope.scopeVar=data;
}

在控制器中：

  service.serviceMethod($scope);

当控制器调用serviceMethod 或service 时。处理数据后分配给 scope.scopeVar.here scope 引用 $scope 对象。（我们将对象 $scope 传递给 serviceMethod 方法）

第二种方法-

服务中：

serviceMethod: functon(){
   //processing
   returndata;
}

在控制器中：

  $scope.scopeVar=service.serviceMethod();

【讨论】：

第一种方法只是不好的实现，不应该使用。第二种方法很好。还有第三种方法太常见了，服务返回一个承诺而不是实际数据。也可以添加该示例。

【解决方案3】：

您没有“从服务设置范围变量”绑定到它。它确实是相同的语义。 @sss 完全正确

【讨论】：