Я хочу отправить некоторые данные со стороны клиента на сервер. Я хочу отправить эти данные с помощью службы и контроллера. Но данные не будут переходить на стороне сервера,отправка данных на сервер с использованием служб и контроллеров
Это мой view.html
<section class="af-wrapper">
<h3 id="addStyles">ADD STYLES</h3>
<form class="af-form" id="af-form" novalidate>
<label for="input-name" class="header">Header Image</label>
<input type="file" fileread="styles.uploadme"/>
<b id="preview">Preview:</b>
<img src="{{styles.uploadme}}" ng-model="styles.vm.uploadme" width="100" height="50" alt="Image preview...">
<div style="white-space:nowrap">
<label for="myColor" class="background">Background</label>
<color-picker ng-model="styles.myColor" class="colorPicker"></color-picker>
</div>
<br />
<label for="fonts" class="fontTitles">Font Titles</label>
<div ng-controller="StylesCtrl">
<div id="fontDropDown">
<select ng-options="font for font in fonts" ng-model="styles.textSize.font"></select>
</div>
<br />
<h3 ng-style="{'font-family': styles.textSize.font, 'font-size': styles.textSize.size + 'px'}">Text Is</h3>
<div class="fontSize">Font Size Slider</div>
<br />
<input class="slider" min="12" max="24" ng-model="styles.textSize.size" type="range">
</div>
<input type="submit" ng-click='addStyles(styles)' value="Add Styles"/>
</form>
</section>
Это мой контроллер, чтобы получить шрифт и размеры
(function() {
'use strict';
angular.module("appBuilderApp").controller("StylesCtrl",
["$scope",StylesCtrl]);
function StylesCtrl($scope) {
$scope.fonts = [
"Arial",
"Tahoma"
];
$scope.textSize = {
font: "Arial",
size: 18
};
}
})();
Это мой контроллер отправить данные
(function() {
'use strict';
angular.module('appBuilderApp').controller('TemplateEditorCtrl', [
'$scope', '$auth', '$http', '$sce', 'constants', '$stateParams', 'ngDialog', 'SERVER_URL', 'alert', 'FileUploader', 'Upload','appStylesResource',
TemplateEditorCtrl
]);
function TemplateEditorCtrl($scope, $auth, $http, $sce, constants, $stateParams, ngDialog, SERVER_URL, alert, FileUploader, Upload,appStylesResource) {
appStylesResource.getFonts()
.success(function(data) {
$scope.addStyles = data;
});
$scope.addStyles = function(styles) {
header:styles.uploadme;
color: styles.myColor;
font: styles.textSize.font;
fontSize: styles.textSize.size;
console.log(styles);
if(styles != null){
appStylesResource.addFonts($scope.header)
.success(function(data){
$scope.addStyles = {};
$scope.addStyles = data;
})
}
};
}
})();
Это моя служба
(function(){
'use strict';
angular.module('appBuilderApp').service('appStylesResource',[
'$http', 'SERVER_URL',appStylesResource]);
function appStylesResource($http,SERVER_URL){
return {
getFonts : function() {
return $http.get(SERVER_URL + 'api/templateEdit/addStyles');
},
addFonts : function(fontData){
return $http.post(SERVER_URL + 'api/templateEdit/addStyles' + fontData);
}
}
}
})();
Моя цель - получить некоторые данные от пользователя и отправить его на сервер, я хочу использовать для этого службу и контроллер. Пожалуйста, помогите решить эту проблему.
Спасибо за помощь, она хорошо работает – shamila