Javascript Laravel和Angular js文件上载

如何使用laravel和angular js保存图像？ 有更多的输入，但对我有用，是文本类型

我的索引：

<div class="container" ng-app="todoApp" ng-controller="todoController">
<h1>Profile</h1>
<div class="row">
    <div class="col-sm-4">
        <div class="form-group">
            <h4>Foto de perfil: </h4>
            <div class="input-group">
                <span class="input-group-btn">
                    <span class="btn btn-primary btn-file">
                        Browse&hellip;  <input type='File' name="photo" ng-model="todo.photo" class="image-upload"required/>
                    </span>
                </span>
                <input type="text" class="form-control" readonly>
            </div>
        </div>

    <div class="col-sm-6">
        <div class="form-group">
            <label for="">Nombre del bar: </label>
            <input type='text' ng-model="todo.name" class="form-control" required/>
        </div>
        <button class="btn btn-primary btn-block"  ng-click="addTodo()">Guardar</button>
        <i ng-show="loading" class="fa fa-spinner fa-spin"></i>
    </div>
</div>

我的模型：

namespace App;
use Cviebrock\EloquentSluggable\SluggableInterface;
use Cviebrock\EloquentSluggable\SluggableTrait;
use Illuminate\Support\Facades\Input;
use Illuminate\Database\Eloquent\Model;

 class bar extends Model
 {
   protected $fillable = array('name','photo', 'cover', 
   'description',  'phone', 'email','direction', );

 public function setPhotoAttribute($photo)
 {
   $file = array('image' => Input::file('photo'));
   $destinationPath = 'images/bar/profile';
   $extension = Input::file('photo')->getClientOriginalExtension();
   $fileName = rand(11111,99999).'.'.$extension;
   $this->attributes['photo'] = $fileName;
   Input::file('photo')->move($destinationPath, $fileName);
  }

酒吧控制器：

public function index()
{
    return view ('bar.index');
}

酒吧控制器： 公共函数存储（）{

App.js（Angular js）：

var-app=angular.module（'todoApp'，function（$interpolateProvider）{
$interpolateProvider.startSymbol（“”）；
});
//Todo控制器，。。。
app.controller（'todoController'，函数（$scope，$http）{
$scope.todos=[]；
$scope.loading=false；
$scope.init=函数（）{
$scope.loading=true；
$http.get（'/bar'）。
成功（函数（数据、状态、标题、配置）{
$scope.todos=数据；
$scope.loading=false；
});
}
$scope.addTodo=函数（）{
$scope.loading=true；
$http.post（'/bar'，{
名称：$scope.todo.name，
description:$scope.todo.description，
电话：$scope.todo.phone，
电子邮件：$scope.todo.email，
方向：$scope.todo.direction，
照片：$scope.todo.photo，
封面：$scope.todo.cover
}).success（函数（数据、状态、标题、配置）{
$scope.todos.push（数据）；
$scope.todo=''；
$scope.loading=false；
});
};
$scope.updateTodo=函数（todo）{
$scope.loading=true；
$http.put（'/bar'+todo.id{
标题：todo.title，
完成：完成
}).success（函数（数据、状态、标题、配置）{
todo=数据；
$scope.loading=false；
});;
};
$scope.deleteTodo=函数（索引）{
$scope.loading=true；
var todo=$scope.todos[index]；
$http.delete（'/bar'+todo.id）
.success（函数（）{
$scope.todos.splice（索引1）；
$scope.loading=false；
});;
}; 
$scope.init（）；
});

我正在使用下面的代码上传图像。试试这个，我希望它对你也有用

---

如何在此处添加？$scope.addTodo=function（）{$scope.loading=true；$http.post（'/event'，{name:$scope.todo.name，start:$scope.todo.start，description:$scope.todo.description，photo:$scope.todo.photo，done:$scope.todo.done}）。成功（函数（数据、状态、标题、配置）{$scope.todos.push（数据）；$scope.todo=''；$scope.loading=false；}）；}；上面的解决方案是有效的。我宁愿使用time（）而不是rand（111119999）。你解决了吗？

public function index()
{
    return view ('bar.index');
}

    $todo = \Auth::user()->bars()->create(Request::all());
    return $todo;
}

var app = angular.module('todoApp', function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});
// Todo Controller ,...

app.controller('todoController', function($scope, $http) {
    $scope.todos = [];
    $scope.loading = false;

    $scope.init = function() {
        $scope.loading = true;
        $http.get('/bar').
        success(function(data, status, headers, config) {
            $scope.todos = data;
                $scope.loading = false;


        });
    }

    $scope.addTodo = function() {

    $scope.loading = true;

    $http.post('/bar', {    
            name: $scope.todo.name,
            description: $scope.todo.description,
            phone: $scope.todo.phone,
            email: $scope.todo.email,
            direction: $scope.todo.direction,
            photo: $scope.todo.photo,
            cover: $scope.todo.cover

        }).success(function(data, status, headers, config) {
            $scope.todos.push(data);
            $scope.todo = '';
            $scope.loading = false;
        });
    };

    $scope.updateTodo = function(todo) {
        $scope.loading = true;

        $http.put('/bar' + todo.id, {
            title: todo.title,
            done: todo.done
        }).success(function(data, status, headers, config) {
            todo = data;
                $scope.loading = false;

        });;
    };

    $scope.deleteTodo = function(index) {

        $scope.loading = true;

        var todo = $scope.todos[index];

        $http.delete('/bar' + todo.id)
            .success(function() {
                $scope.todos.splice(index, 1);
                    $scope.loading = false;

            });;
    }; 

    $scope.init();

});

<input type="file" name="file" onchange="angular.element(this).scope().uploadavtar(this.files)"/>

$scope.uploadavtar = function(files) {
  var fd = new FormData();
  //Take the first selected file
  fd.append("file", files[0]);

  $http.post("/uploadavtar", fd, {
      withCredentials: true,
      headers: {'Content-Type': undefined },
      transformRequest: angular.identity
  }).then(function successCallback(response) {
    alert(response);
    // this callback will be called asynchronously
    // when the response is available
  }, function errorCallback(response) {
    alert(response);
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });
}

Route::post('/uploadavtar', 'UsersController@uploadavtar');

public function uploadavtar(Request $request){
$user = JWTAuth::parseToken()->authenticate();
$user_id = $user->id;
$user_name = $user->first_name." ".$user->last_name;

$file = array('image' => Input::file('file'));
// setting up rules
$rules = array('image' => 'required',); //mimes:jpeg,bmp,png and for max size max:10000
// doing the validation, passing post data, rules and the messages
$validator = Validator::make($file, $rules);
if ($validator->fails()) {
  // send back to the page with the input data and errors
  return "validation failed";
}else {
    // checking file is valid.
    if (Input::file('file')->isValid()) {
      $destinationPath = 'assets/img'; // upload path
      $extension = Input::file('file')->getClientOriginalExtension(); // getting image extension
      $fileName = rand(11111,99999).'.'.$extension; // renameing image
      Input::file('file')->move($destinationPath, $user_name."_$user_id".".jpeg"); // uploading file to given path
      // sending back with message
      return 'Upload successfully';
    }
    else {
      // sending back with error message.
      return 'uploaded file is not valid';
    }
}
}