angularjs - ng-flow を使用してアップロードされたファイルの名前をコントローラーのスコープにバインドして、ng-src タグで参照できるようにする方法

Question

ngflow を使用して、angularJS アプリに画像アップロード機能を構築しようとしています。選択したフォルダーに（phpを使用して）画像をアップロードできるように、なんとか機能させることができました。

私が今やりたいことは、これらの画像を参照して、作成中の ng-src を使用してユーザーのプロファイルに含めることができるようにすることです。これらのプロファイルは、カスタム ディレクティブで作成されます。私がする必要があるのは、コントローラーのスコープ内の変数をフロースコープの一意の識別子変数と同じに設定することであり、その後、好きなように画像パスを参照できるようになると思います。ただし、これを実行しようとすると、未定義のエラーが発生します。これは、コントローラーにフロー スコープを誤って挿入していることを示唆しています。私のコードは以下です。思い入れがあれば最高です。

モジュール

//Module - Inject flow
var App = angular.module('App',['ngRoute', 'flow']);

//Routing - Create views and set flow default settings
App.config(['$routeProvider', 'flowFactoryProvider', function ($routeProvider, flowFactoryProvider) {

$routeProvider 

.when('/register-aboutme', {
    templateUrl: 'pages/user-aboutme.html',
    controller: 'userController'
})

flowFactoryProvider.defaults = {
target: './upload.php',
permanentErrors: [404, 500, 501],
maxChunkRetries: 1,
chunkRetryInterval: 5000,
simultaneousUploads: 4,
singleFile: true
};

flowFactoryProvider.on('catchAll', function (event) {
console.log('catchAll', arguments);
});
}]);

コントローラ

App.controller('userController', ['$scope', '$location', '$log', 'userprof', function($scope, $location, $log, userprof) {

//Attempt to create new property of object equal to recent photo upload
$scope.userprof.photopath = $flow.files[0].uniqueIdentifier;

}]);

//DIRECTIVES
//Creates a directive that shows the current status of the user profile as they register

App.directive("userProfile", function() {
return {
    restrict: 'EC',
    templateUrl: 'directives/userprofile.html',
    replace: true,
    scope: {
        userData: "="
   }
}
});

About Me HTML (ユーザーが写真をアップロードする場所)

<div flow-init class="container">
<form ng-submit="submit()">
<div class="form-group">
    <label for="userphoto">Photo</label>
        <div flow-files-submitted="$flow.upload()" flow-file-success="$file.msg = $message">
            <p class="btn btn-default" type="file" flow-btn>Upload Photo</p>
            <table>
                <tr ng-repeat="file in $flow.files">
                    <td><p>{{file.name}}</p></td>
                    <td><p>{{file.isComplete()}}</p></td>
                    <td><p>{{file.uniqueIdentifier}}</p></td>
                </tr>
            </table>
            <img flow-img="$flow.files[0]" class="userphotoupload"/>
        </div>

</div>

ユーザー プロファイル ディレクティブ

<div class="container">
<div class="panel panel-default">                       
<div class="panel-body">
    <div class="row col-md-12">
        <p><img class="userphoto" ng-src="{{ userData.photopath }}">
    </div>
</div>
</div>
</div>

前もって感謝します！！