我的服务返回函数的文本而不是对象
My service is returning the function's text and not an object
我有一项服务可以在我的应用程序中共享一个对象...我想 post 该对象到 mongo 数据库但是当我调用应该 return 的函数时它给我函数文本的对象。
服务在这里:
angular.module('comhubApp')
.service('markerService', function () {
this.markers = [];
this.newMarker = { title: '',
description: '',
lat: '',
lon: '',
user: '',
created_at: '' };
// This is supposed to return the marker object
this.newMarker = function () {
return this.newMarker;
};
this.setTitle = function (title) {
this.newMarker.title = title;
console.log('title service set: ' + title);
};
this.setDescription = function (description) {
this.newMarker.description = description;
console.log('Description service set: ' + description);
};
this.setLat = function (lat) {
this.newMarker.lat = lat;
console.log('lat service set: ' + lat);
};
this.setLon = function (lon) {
this.newMarker.lon = lon;
console.log('lon service set: ' + lon);
};
this.reset = function () {
this.newMarker = { title: '',
description: '',
lat: '',
lon: '',
user: '',
created_at: ''};
}
this.setMarkers = function (markers) {
this.markers = markers;
}
this.markers = function () {
return this.markers;
}
this.addMarker = function (marker) {
//todo append marker
}
});
newMarker returns:
this.newMarker = function () {
return this.newMarker;
};
使用服务的控制器在这里
$scope.addMarker = function() {
if($scope.newMarker.title === '') {
console.log('newMarker title is empty');
return;
}
markerService.setTitle($scope.newMarker.title);
markerService.setDescription($scope.newMarker.description);
console.log(markerService.newMarker());
// $http.post('/api/markers', { name: $scope.newMarker });
// $scope.newMarker = '';
};
$scope new marker is form data.. 我试图将其直接放入我的服务中,但没有成功。相反,我将表单数据输出到控制器中,然后将其推送到服务中。如果有更好的方法,请告诉我。
如果此服务在任何其他方面不好,请告诉我我是新手,所以我遵循了我在此处看到的另一个答案。
那么,那个函数就是问题所在。我盲目地效仿另一个例子,但在我的例子中这是错误的。解决方案是删除该功能并直接访问 markerService.newMarker。
我仍然是一个大菜鸟,我不确定为什么调用将函数作为字符串返回。这似乎与它的命名方式有关,但这只是一个猜测。
您正在用函数覆盖您的对象。只需给它们不同的名称,它就可以正常工作。
this.newMarker = { ... };
this.getNewMarker = function () { return this.newMarker };
编辑:
您还应该始终从标记创建新实例。否则你只是一直编辑同一个对象。这是我做的例子。这不是最佳做法,但希望您明白这一点。
angular.module('serviceApp', [])
.factory('Marker', function () {
function Marker() {
this.title = '';
this.descrpition = '';
}
// use setters and getters if you want to make your variable private
// in this example we are not using these functions
Marker.prototype.setTitle = function (title) {
this.title = title;
};
Marker.prototype.setDescription = function (description) {
this.description = description;
};
return Marker;
})
.service('markerService', function (Marker) {
this.markers = [];
this.getNewMarker = function () {
return new Marker();
}
this.addMarker = function (marker) {
this.markers.push(marker);
}
})
.controller('ServiceCtrl', function ($scope, markerService) {
$scope.marker = markerService.getNewMarker();
$scope.addMarker = function () {
markerService.addMarker($scope.marker);
$scope.marker = markerService.getNewMarker();
}
$scope.markers = markerService.markers;
});
您也可以在控制器中创建 Marker 并使用 markerService 来存储您的对象。
我有一项服务可以在我的应用程序中共享一个对象...我想 post 该对象到 mongo 数据库但是当我调用应该 return 的函数时它给我函数文本的对象。
服务在这里:
angular.module('comhubApp')
.service('markerService', function () {
this.markers = [];
this.newMarker = { title: '',
description: '',
lat: '',
lon: '',
user: '',
created_at: '' };
// This is supposed to return the marker object
this.newMarker = function () {
return this.newMarker;
};
this.setTitle = function (title) {
this.newMarker.title = title;
console.log('title service set: ' + title);
};
this.setDescription = function (description) {
this.newMarker.description = description;
console.log('Description service set: ' + description);
};
this.setLat = function (lat) {
this.newMarker.lat = lat;
console.log('lat service set: ' + lat);
};
this.setLon = function (lon) {
this.newMarker.lon = lon;
console.log('lon service set: ' + lon);
};
this.reset = function () {
this.newMarker = { title: '',
description: '',
lat: '',
lon: '',
user: '',
created_at: ''};
}
this.setMarkers = function (markers) {
this.markers = markers;
}
this.markers = function () {
return this.markers;
}
this.addMarker = function (marker) {
//todo append marker
}
});
newMarker returns:
this.newMarker = function () {
return this.newMarker;
};
使用服务的控制器在这里
$scope.addMarker = function() {
if($scope.newMarker.title === '') {
console.log('newMarker title is empty');
return;
}
markerService.setTitle($scope.newMarker.title);
markerService.setDescription($scope.newMarker.description);
console.log(markerService.newMarker());
// $http.post('/api/markers', { name: $scope.newMarker });
// $scope.newMarker = '';
};
$scope new marker is form data.. 我试图将其直接放入我的服务中,但没有成功。相反,我将表单数据输出到控制器中,然后将其推送到服务中。如果有更好的方法,请告诉我。
如果此服务在任何其他方面不好,请告诉我我是新手,所以我遵循了我在此处看到的另一个答案。
那么,那个函数就是问题所在。我盲目地效仿另一个例子,但在我的例子中这是错误的。解决方案是删除该功能并直接访问 markerService.newMarker。
我仍然是一个大菜鸟,我不确定为什么调用将函数作为字符串返回。这似乎与它的命名方式有关,但这只是一个猜测。
您正在用函数覆盖您的对象。只需给它们不同的名称,它就可以正常工作。
this.newMarker = { ... };
this.getNewMarker = function () { return this.newMarker };
编辑:
您还应该始终从标记创建新实例。否则你只是一直编辑同一个对象。这是我做的例子。这不是最佳做法,但希望您明白这一点。
angular.module('serviceApp', [])
.factory('Marker', function () {
function Marker() {
this.title = '';
this.descrpition = '';
}
// use setters and getters if you want to make your variable private
// in this example we are not using these functions
Marker.prototype.setTitle = function (title) {
this.title = title;
};
Marker.prototype.setDescription = function (description) {
this.description = description;
};
return Marker;
})
.service('markerService', function (Marker) {
this.markers = [];
this.getNewMarker = function () {
return new Marker();
}
this.addMarker = function (marker) {
this.markers.push(marker);
}
})
.controller('ServiceCtrl', function ($scope, markerService) {
$scope.marker = markerService.getNewMarker();
$scope.addMarker = function () {
markerService.addMarker($scope.marker);
$scope.marker = markerService.getNewMarker();
}
$scope.markers = markerService.markers;
});
您也可以在控制器中创建 Marker 并使用 markerService 来存储您的对象。