使用ng-flow和AngularJS

时间:2016-03-30 19:38:08

标签: javascript angularjs image-uploading ng-flow

我正在尝试使用ng-flow在javascript中使用图像,使用RPC调用将其发送到后端服务器。 问题是我遵循他们页面中的tutorial,但我没有找到如何在AngularJS app中的JavaScript控制器中访问图像。

我仍然是Angular的新手,也许这个问题不是一个大问题,但我找不到这样做的方法。

我的代码很简单,一个简单的HTML代码:

<div class="container"  flow-init
    flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]"
      flow-files-submitted="$flow.upload()">
  <h1>flow image example</h1>
  <hr class="soften"/>


  <div>
    <div class="thumbnail" ng-hide="$flow.files.length">
      <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&text=no+image" />
    </div>
    <div class="thumbnail" ng-show="$flow.files.length">
      <img flow-img="$flow.files[0]" />
      <h2>{{$flow.files[0].name}}</h2>
    </div>
    <div>
      <span class="uk-button" ng-hide="$flow.files.length" flow-btn flow-attrs="{accept:'image/*'}">Select image</span>

      <a href="#" class="btn" ng-show="$flow.files.length" flow-btn flow-attrs="{accept:'image/*'}">Change</a>
      <a href="#" class="btn btn-danger" ng-show="$flow.files.length" ng-click="$flow.cancel()"> Remove </a>

      <span class="uk-button" flow-btn>Upload File</span>

    </div>
    <p>
      Only PNG,GIF,JPG files allowed.
    </p>
  </div>
</div>

ng-flow需要的工厂是:

routerApp.config(['flowFactoryProvider', function (flowFactoryProvider) {


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);
  });
  }]);

我也有控制器的代码到这个页面。我试图访问图像,但我不知道这是怎么做的。

有什么想法吗?

如果你知道用其他工具做任何方法或者知道一个好的教程,我真的很想知道。

感谢所有人。

0 个答案:

没有答案