{"action":"created","issue":{"url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/1034","repository_url":"https://api.github.com/repos/danialfarid/ng-file-upload","labels_url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/1034/labels{/name}","comments_url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/1034/comments","events_url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/1034/events","html_url":"https://github.com/danialfarid/ng-file-upload/issues/1034","id":109285451,"number":1034,"title":"Upload images to firebase on form submit","user":{"login":"SaidThaher","id":9959852,"avatar_url":"https://avatars.githubusercontent.com/u/9959852?v=3","gravatar_id":"","url":"https://api.github.com/users/SaidThaher","html_url":"https://github.com/SaidThaher","followers_url":"https://api.github.com/users/SaidThaher/followers","following_url":"https://api.github.com/users/SaidThaher/following{/other_user}","gists_url":"https://api.github.com/users/SaidThaher/gists{/gist_id}","starred_url":"https://api.github.com/users/SaidThaher/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SaidThaher/subscriptions","organizations_url":"https://api.github.com/users/SaidThaher/orgs","repos_url":"https://api.github.com/users/SaidThaher/repos","events_url":"https://api.github.com/users/SaidThaher/events{/privacy}","received_events_url":"https://api.github.com/users/SaidThaher/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":7,"created_at":"2015-10-01T12:01:51Z","updated_at":"2016-04-08T05:07:05Z","closed_at":"2015-12-27T20:41:14Z","body":"I'm building a small web app (blog post alike) using AngularJs and Firebase. i implemented the addPost controller earlier and it worked good. After i wanted to add an input file inside the form which already implemented to upload images to firebase on form submit using ng-file-upload directive . As a new in angular i knew that firebase can save images as base64 but i couldn't figur out how to make it work. Maybe some will say that its repeated question, but believe me i searched allover here i couldent find answer.\r\nHere is my form file :\r\n\r\n<div class=\"container\" ng-controller=\"AddPostCtrl\">\r\n\r\n        <form class=\"form-horizontal\" ng-submit=\"AddPost(files)\">\r\n            <fieldset>\r\n\r\n                <!-- Form Name -->\r\n                <legend>Create Post</legend>\r\n\r\n                <!-- Text input-->\r\n                <div class=\"form-group\">\r\n                    <label class=\"col-md-4 control-label\" for=\"txtTitle\">Title</label>\r\n                    <div class=\"col-md-4\">\r\n                        <input id=\"txtTitle\" name=\"txtTitle\" ng-model=\"article.title\" type=\"text\" placeholder=\"placeholder\" class=\"form-control input-md\">\r\n\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- Textarea -->\r\n                <div class=\"form-group\">\r\n                    <label class=\"col-md-4 control-label\" for=\"txtPost\">Post</label>\r\n                    <div class=\"col-md-4\">\r\n                        <textarea class=\"form-control\" id=\"txtPost\" ng-model=\"article.post\" name=\"txtPost\"></textarea>\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- Images -->\r\n                <div class=\"form-group\">\r\n                    <label class=\"col-md-4 control-label\" for=\"pictures\">Add Pictures</label>\r\n                    <div class=\"col-md-4\">\r\n                        <input id=\"pictures\" type=\"file\" ngf-select ng-model=\"files\"  name=\"file\"    \r\n                          accept=\"image/*\" ngf-max-size=\"2MB\" ngf-multiple=\"true\" ngf-keep=\"true\" ngf-keep-distinct=\"true\" class=\"btn btn-primary\"/>\r\n                <!-- Show image thumb and remove option -->\r\n                        <span ng-repeat=\"file in files\">\r\n                           <img ngf-thumbnail=\"!file.$error && file\" class=\"thumb\"> <button class=\"btn btn-danger\" ng-click=\"file = null\" ng-show=\"file\">Remove</button>\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- Button -->\r\n                <div class=\"form-group\">\r\n                    <label class=\"col-md-4 control-label\" for=\"singlebutton\"></label>\r\n                    <div class=\"col-md-4\">\r\n                        <input id=\"singlebutton\" ng-disabled=\"!article.title || !article.post\" name=\"singlebutton\" class=\"btn btn-primary\" type=\"submit\" value=\"Publish\" />\r\n                    </div>\r\n                </div>\r\n\r\n            </fieldset>\r\n        </form>\r\n\r\n\r\n    </div>\r\n\r\n\r\nhere is my controller :\r\n\r\nangular.module('myApp.addPost', ['ngRoute'])\r\n\r\n.controller('AddPostCtrl', ['$scope','CommonProp','$firebase','$location','Upload','$timeout', function($scope,CommonProp,$firebase,$location,Upload,$timeout) {\r\n    if(!CommonProp.getUser()){\r\n    $location.path('/main');\r\n    }\r\n\r\n\r\n    /***** Add data to firebase *****/\r\n    $scope.AddPost = function(files) {\r\n            var fb = new Firebase(\"https://hotelboard.firebaseio.com/Articles/\");\r\n\r\n            var title = $scope.article.title;\r\n            var post  = $scope.article.post;\r\n            var user  = CommonProp.getUser();\r\n            var images = $scope.file ;\r\n            fb.push({\r\n                title:     title,\r\n                post:      post,\r\n                emailId:   user,\r\n                images : images,\r\n                '.priority': user\r\n\r\n            },function(error) {\r\n                if (error) {\r\n                    console.log(\"Error:\",error);\r\n                } else {\r\n                console.log(\"Post set successfully!\");\r\n                console.log($scope.file);\r\n                $location.path('/home');\r\n                $scope.$apply();\r\n\r\n            }\r\n\r\n        });\r\n\r\n    }\r\n\r\n}]);\r\n\r\nand here is my GitHub for full project files\r\n\r\nhttps://github.com/SaidThaher/HotelApp\r\n\r\nIf i get help with this issue , it will be more question regards to the result. PLEASE HELP"},"comment":{"url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/comments/207216742","html_url":"https://github.com/danialfarid/ng-file-upload/issues/1034#issuecomment-207216742","issue_url":"https://api.github.com/repos/danialfarid/ng-file-upload/issues/1034","id":207216742,"user":{"login":"danialfarid","id":1676054,"avatar_url":"https://avatars.githubusercontent.com/u/1676054?v=3","gravatar_id":"","url":"https://api.github.com/users/danialfarid","html_url":"https://github.com/danialfarid","followers_url":"https://api.github.com/users/danialfarid/followers","following_url":"https://api.github.com/users/danialfarid/following{/other_user}","gists_url":"https://api.github.com/users/danialfarid/gists{/gist_id}","starred_url":"https://api.github.com/users/danialfarid/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/danialfarid/subscriptions","organizations_url":"https://api.github.com/users/danialfarid/orgs","repos_url":"https://api.github.com/users/danialfarid/repos","events_url":"https://api.github.com/users/danialfarid/events{/privacy}","received_events_url":"https://api.github.com/users/danialfarid/received_events","type":"User","site_admin":false},"created_at":"2016-04-08T05:07:05Z","updated_at":"2016-04-08T05:07:05Z","body":"post it on SO this is a question not an issue."}}