Getters and Setters in AngularJS
Getters and Setters in AngularJS
confirm("Ohhh, hello there, is it Ok to click Cancel?");
我认为这基本上是一个关于Angular上CRUD的问题。我对getter和setter有点困惑,主要是因为Angular几乎完成了所有的获取和设置工作,因为它的双向数据绑定。我想知道创建getter和setter的最佳可伸缩方式是什么,这样我以后就不需要修改我的函数了。
在第一个安排上,我尽量做到简单,但是我在得到和得到设置时感到不舒服。
安排01:
$scope.getData = function(){
$http.get(url + '/data')
.then( function (res) {
return res.data; } );
};
$scope.setData = function () {
$scope.data = $scope.getData();
};
$scope.insertData = function (data) {
$http.post(url + '/data', { data: data})
.then( function (res) {
// nothing here. } );
};
然而,在这第二个安排中,我试图直接去我需要的地方。当我从服务器获取数据时,我自动设置了$作用域。数据到检索数据;
安排02:
$scope.getData = function () {
$http.get(url + '/data')
.then( function (res) {
$scope.data = res.data;
});
};
$scope.insertData = function (data) {
$http.post( url + '/data', { data: data })
.then( function (res) {
$scope.getData(); //To update.
//OR $scope.data.push(res.data);
});
};
往下看,我在Angular文档中发现了这一点,但是如果Angular已经这样做了,那么使用getter/setter有什么意义呢?与其他技术相比,很难进行比较,因为Angular有自动获取功能。
我甚至不知道如何表达这个问题。但是,基本上,我想知道我的getter和setter是如何影响我未来的应用的,如果有一个好的方法,为什么要在Angular中创建getter和setter。
谢谢你的建议
最好的做法是将逻辑包装到Service中。你必须知道,在Angular中,所有的服务都是Singleton,一个Service只有一个实例。
我做了一个简单的例子,通过使用$q.defer(),这是来自延迟API的承诺管理器。$q.defer() get 2个方法:
resolve(value):通过给她最终值来解析我们关联的promise
reject(reason):解决承诺错误。
(function(){
function Controller($scope, $q, Service) {
//Use promise manager
var defer = $q.defer();
///Create our promise
var promise = defer.promise;
$scope.data = [];
var newData = [
{
name:'john',
age: 25
},
{
name: 'toto',
age: 13
}
];
Service.get().then(function(data){
//Retrieve our data
$scope.data = data;
//Set new data to our factory
Service.set(newData);
//Retrieve new data
Service.get().then(function(data){
//Resolve new data
defer.resolve(data);
});
});
//Retrieve new dataset
promise.then(function(data){
$scope.data = data;
})
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
服务strong>
(function(){
function Service($q){
var data = [0,1,2,3,4];
function set(value){
data = value;
}
function get(){
return $q(function(resolve){
//Simulate latency
setTimeout(function(){
//Resolve our data
resolve(data);
}, 1000);
});
}
return {
get: get,
set: set
};
}
angular
.module('app')
.factory('Service', Service);
})();