php – 图像未从angular上传到Laravel
发布时间:2020-12-14 19:42:35 所属栏目:大数据 来源:网络整理
导读:我创建了一个用于保存项目详细信息的表单.我正在使用laravel 5.1和angularJS.项目信息将成功保存,但图像未上传到服务器,图像细节也未保存在数据库中.我需要帮助将图像上传到laravel使用 angularjs 它是我的HTML代码: div ng-controller="itemController"for
我创建了一个用于保存项目详细信息的表单.我正在使用laravel 5.1和angularJS.项目信息将成功保存,但图像未上传到服务器,图像细节也未保存在数据库中.我需要帮助将图像上传到laravel使用
angularjs
它是我的HTML代码: <div ng-controller="itemController"> <form ng-submit="addItem()"> <label>Name:</label><input type="text" name="name" value="" ng-model="newitem.name" placeholder="Item Name"> <label>Model No:</label><input type="text" name="model" value="" ng-model="newitem.model" placeholder="Model Number"> <label>Size:</label><input type="text" name="size" value="" ng-model="newitem.size" placeholder="Item Size"> <label>Colour:</label><input type="text" name="color" value="" ng-model="newitem.color" placeholder="Item Colour"> <br> <label>Description:</label><textarea cols="30" rows="5" ng-model="newitem.description" placeholder="Description"></textarea> <br> <label>Photo:</label><input type="file" accept="imag/works" ngf-select="" ngf-multiple="true" class="form-control" id="img" name="img" placeholder="Image" ng-model="newitem.photo" multiple> <br> <button type="submit">Save</button> </form> <div ng-show="sendmessage"> Item Saved Successfully........... </div> <div> AngularJs代码: app.controller('itemController',function($scope,$http,Item) { $scope.items=[]; $scope.newitem={}; $scope.curitem = {}; $scope.sendmessage=false; loadData(); //To Send Message to Site Admin.................. $scope.addItem=function(){ if($scope.curitem.id){ //TODO error display $scope.newitem.$update(function () { angular.extend($scope.curitem,$scope.curitem,$scope.newitem); $scope.sendmessage=true; }); }else{ $scope.newitem.$save(function (item) { //TODO error display $scope.items.push(item); $scope.sendmessage=true; }); } //$scope.sendmessage=true; $scope.curitem = {}; $scope.newitem = {}; $scope.newitem=new Item(); loadData(); }; function loadData(){ var items =Item.query(function () { $scope.items = items; $scope.newitem=new Item(); }); } }); angular.module('ItemService',[]).factory('Item',['$resource',function($resource){ return $resource('/api/items/:itemId',{ itemId:'@id' },{ update:{ method:'PUT' } }); } ]); ItemController.php如下: <?php namespace AppHttpControllersAuth; use AppFile; use AppItem; use IlluminateHttpRequest as Request; use AppHttpRequests; use AppHttpControllersController; use IlluminateHttpResponse; use Validator; use Input; class ItemController extends Controller { /** * Validates given data for account * @param array $data * @return Validator */ protected function validator(array $data) { // Loan account is not validated return Validator::make($data,[ 'name' => 'required','size' => 'required|max:255' ]); } /** * Store a newly created resource in storage. * * @param IlluminateHttpRequest $request * @return IlluminateHttpResponse */ public function store(Request $request) { $validator = $this->validator($request->all()); if($validator->fails()){ return Response::json( $validator->errors(),400); } $item=new Item($request->all()); if($item->save()) { $id=$item->id; if ($request->hasFile('photo')) { $file = $request->file('photo'); $image=new File(); $image->name = $this->uploadImage($file); $image->file_id=$id; $image->save(); } } return Response::json(['error' => 'Server is down'],500); } /** * To Strore Images * * */ public function uploadImage($file){ $storedFileName=""; if(!empty($file)){ $extension=$file->getClientOriginalExtension(); $fileName = rand(22222,99999).'.'.$extension; $storedFileName=base_path().'/img/works/'. $fileName; $file->move( base_path().'/img/works/',$fileName ); } return $storedFileName; } } 解决方法
要通过AngularJS上传图像,您需要做一些额外的工作.你可以使用像
nervgh/angular-file-upload(或其他一些库)这样的库,也可以自己动手.有关进一步参考,请参阅
this tutorial by egghead
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |