Question

在角度工厂中创建get / set属性的最佳做法是什么，该属性将由视图X中的控制器设置，并使用视图Y由同一控制器获取？我应该像下面这样使用$ rootScope吗？

厂：

angular.module('start.services').factory('bluetoothFactory', ['$q', '$window', '$rootScope', function($q, $window, $rootScope) {
 return {

  connectedDeviceSet:  function(device)
  {
    $rootScope.connectedDevice = device;
  },
  connectedDeviceGet: function()
  {
    return $rootScope.connectedDevice;
  },
...

控制器：

angular.module('start.controllers',[]).controller('bluetoothCtrl', function($scope, $ionicModal, $timeout, bluetoothFactory) 
{
...
$scope.list = function()
  {
    bluetoothFactory.list().then(function(data)
    {
      $scope.info = data;
      if (data.length > 0)
      {
        bluetoothFactory.connectedDeviceSet = data[0];
      }
    }, 
    function(error) 
    { 
      $scope.error = error;
    });
  };
$scope.readEPCForEncoding = function() 
{
   var device = bluetoothFactory.connectedDeviceGet;
   ....
}

Answer 1

你应该这样写。

angular.module('start.services').factory('bluetoothFactory', ['$q', '$window', '$rootScope', function($q, $window, $rootScope) {

 return {
  connectedDevice : null,       
  connectedDeviceSet:  function(device)
  {
    this.connectedDevice = device;
  },
  connectedDeviceGet: function()
  {
    return this.connectedDevice;
  },

不需要$rootScope，因为它违反了全球范围。

请参阅此Plunker以获得更好的理解。检查script.js

设置

bluetoothFactory.connectedDeviceSet(dataishere);

获得

var dataishere = bluetoothFactory.connectedDeviceGet();

Answer 2

您应该使用服务而不是工厂。服务应定义为prototype - 转换为其他语言的class。尽量不要访问工厂或服务中的$ rootScope。这意味着您没有正确封装您的属性。这将导致碰撞和奇怪的错误。

var app = angular.module('app', []);

function Bluetooth() {
  this.connectedDevice;
}

Bluetooth.prototype.setConnectedDevice = function(value) {
  this.connectedDevice = value;
}

Bluetooth.prototype.getConnectedDevice = function() {
  return this.connectedDevice;
}
app.service('bluetooth', Bluetooth);


DeviceController.$inject = ['bluetooth'];
function DeviceController(bluetooth) {
  this.bluetooth = bluetooth;
  
  this.device;
}

DeviceController.prototype.getDevice = function() {
  this.device = this.bluetooth.getConnectedDevice(); 
}

app.controller('DeviceController', DeviceController);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
  
  <div ng-controller="DeviceController as vm1">
    
    Controller 1: <br><br>
    
    <button ng-click="vm1.bluetooth.setConnectedDevice('Device set from instance one')">Set Device</button>     
    <br/><br>
    <button ng-click="vm1.getDevice()">Get Device</button>
    <br/><br>
    Device: {{vm1.device}}
    
    <br>
    Device in Service: {{vm1.bluetooth.connectedDevice}}
    
  </div>
  
  <br/> <br/>
  
  <div ng-controller="DeviceController as vm2">
    
    Controller 2: <br><br>
    
    <button ng-click="vm2.bluetooth.setConnectedDevice('Device set from instance Two')">Set Device</button>     
    <br/><br>
    <button ng-click="vm2.getDevice()">Get Device</button>
    <br/><br>
    Device: {{vm2.device}}
    
    <br>
    Device in Service: {{vm2.bluetooth.connectedDevice}}
    
  </div>

</div>

然后在您的控制器中，如果您可以代理set和get方法，或者将bluetooth服务公开给视图。

单击控制器的两个实例中的按钮，观察设备的设置方式。

Answer 3

如果你想在每个控制器中使用相同的数据，那么

简单有效。你不需要将数据存储在最差的Base中。

virtual

在Angular Factory中设置属性的正确方法

3 个答案: