2016-01-24 34 views
3

我希望此服务的行为如同模型。将服务用作模型

angular.module('secrunApp').service('appState', function() { 

    this.currentAnswerset = 1; 
    this.currentQuestion = 2; 
    this.name; 

    function set(key, value) { 
    console.log('>> set appStateModel', key, value); 
    var localVar = key; 
    this[localVar] = value; 
    } 

    function get(key) { 
    console.log('<< get appStateModel', key, this[key]); 
    return this[key]; 
    } 

    return { 
    get: get, 
    set: set 
    } 
}); 

几个问题。

1 - 最初默认属性在启动应用程序和访问此道具时未定义。为什么?

2 - 这是一个简单但正确的处理作为一个模型的服务和存储数据可以通过整个应用程序访问吗?

3 - 我会通过返回一个get/set API来假设剩下的属性不能直接访问(私有),但它们不是。有人可以解释为什么这样吗?

一旦注入控制器,我设置并获取属性值如下,完美。

appState.set('name', 'SJV'); 
appState.get('name'); 

一般问题:什么将是一个坚实和正确的实施。我想保持简单,平易近人。

回答

1

问题1

​​需要一个构造函数。哪个Angular使用new运算符实例化。所以,你不需要返回一个新的对象。 JavaScript为你返回对象。现在,在服务构造函数中,可以将公共函数添加到this变量中。

angular 
 
    .module('secrunApp') 
 
    .service('appState', function() { 
 
     this.currentAnswerset = 1; 
 
     this.currentQuestion = 2; 
 
     this.name; 
 

 
     this.set = function (key, value) { 
 
      console.log('>> set appStateModel', key, value); 
 
      var localVar = key; 
 
      this[localVar] = value; 
 
     }; 
 

 
     this.get = function (key) { 
 
      console.log('<< get appStateModel', key, this[key]); 
 
      return this[key]; 
 
     }; 
 
    });

现在,您的服务实例的引用由this服务构造函数中引用同一个对象。但是由于你的数据与服务对象本身有关,它们还没有被私有。我们稍后再回来。

问题2

你可以尝试有一个基本的控制器上涨的DOM,处理所有的应用级视图模型。例如。

<body ng-controller="AppController as appVm"> 
 
    <div ng-controller="SomethingController as somethingVm"> 
 
    <p>{{ appVm.currentAnswerset }}</p> 
 
    </div> 
 
</body>

问题3

为了保持私有变量,在您的服务构造函数,只有getter和setter可以通过关闭访问定义的局部变量。

angular 
 
    .module('secrunApp') 
 
    .service('appState', function() { 
 
     // Private data only getter and setter can access 
 
     var data = { 
 
      currentAnswerset: 1, 
 
      currentQuestion: 2, 
 
      name: '' 
 
     }; 
 

 
     this.set = function (key, value) { 
 
      data[key] = value; 
 
     }; 
 

 
     this.get = function (key) { 
 
      return data[key]; 
 
     }; 
 
    });

+0

这很酷,与关闭工作,我一直在寻找。然而我不能设置也没有得到一个值(appState注入)我的控制器通过'appState.set('名称','SJV')' - 必须是我忽略的小事情吗? –

+0

这些函数被错误地命名。 Getter被命名为set,setter被命名为get。可能这就是为什么它不适合你。我更新了代码。 – Prashant

1

此引用是指您的服务创建功能,而不是您要返回的对象。这是一个修复的例子。

var result = {}; 
result.currentAnswerset = 1; 
result.currentQuestion = 2; 
result.name; 

function set(key, value) { 
    console.log('>> set appStateModel', key, value); 
    var localVar = key; 
    result[localVar] = value; 
} 

function get(key) { 
    console.log('<< get appStateModel', key, result[key]); 
    return result[key]; 
} 

result.get = get; 
result.set = set; 
return result; 
+0

这个工程就像一个魅力,但我通过闭合需要私人瓦尔像PRASHANT他的样本中解释道。 –