Integrating ngTagsInput into my blog allows users to add existing or custom tags to new posts. The blog utilizes a firebase datasource accessible through a factory:
servicesModule.factory("postsDB", function($resource){
return $resource("https://datasource.firebaseio.com/Posts.json", {
id: "@id"
},
{
update: {
method: "PUT"
},
query: {
method: 'GET',
isArray: false }
});
});
To ensure the reusability of ngTagsInput, I aim to transform it into a service so that the Tags field can be effectively referenced across different controllers. Here's how the HTML markup looks:
<tags-input ng-model="post.Tags">
<auto-complete source="loadTags($query)"></auto-complete>
</tags-input>
I am working on creating a service for ngTagsInput which will leverage the previously mentioned service (postsDB
). Here is the code snippet:
servicesModule.factory ( 'AddTags' , function($scope, $http, postsDB) {
var myTags = '';
var myTags = $firebaseArray(postsDB.child('Tags'));
function loadTags (query) {
return $http.get('/Tags?query=' + query);
};
});
And in the controller:
controllersModule.controller('AddPostCtrl', ["$scope", '$location', '$firebaseArray', '$sce', 'postsDB', 'AddTags', function($scope, $location, $firebaseArray , $sce, postsDB, AddTags){
AddTags(function(myTags){
$scope.post.Tags = myTags;
});
However, an error is being thrown:
Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- AddTags
It appears that AddTags is not recognized as a factory service. How can I correctly map $scope.repeatevariable.Tags
to the myTags key in the Firebase source?
EDITS - Throws Error:
ervicesModule.factory ( 'InputTags' , function($http, postsDB, $firebaseArray) {
var myTags = '';
var myTags = $firebaseArray(postsDB.child('Tags'));
function loadTags (query) {
return $http.get('/tags?query=' + query);
};
});