NG-flow.js，如何顯示HTML或控制器

responsed JSON數據我使用的是NG-流，腳本命名從這裏NG-流standalone.js：https://github.com/flowjs/ng-flow NG-flow.js，如何顯示HTML或控制器

我的概念是當用戶加入一個新的項目，只有上傳字段正在顯示，一旦照片上傳，額外的表單字段將顯示，例如標題描述。

在代碼中，應用程序將創建product_id，image_id，然後保存該文件。保存過程完成後，它將以json格式返回product_id，image_id等。一旦定義了product_id，HTML，隱藏的表單字段將被顯示。

我看到JSON響應控制檯日誌中的服務器，但不知道如何顯示它在HTML或角度控制器。我無法在文檔和演示中看到此操作方法。誰能幫我？

感謝

示例代碼：在「xxx.product_id」

.. 
<script src="/assets/js/ng-flow-standalone.js"></script> 
.. 
<div class="row"> 
    <div class="col-md-4" flow-init="{target:'upload_image.json'}" flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
     <h3 class="panel-title">Photos</h3> 
     </div> 
     <div class="panel-body"> 
     <div class="row"> 
      <div ng-repeat="file in $flow.files"> 
      <div class="col-md-3"> 
       <div class="thumbnail"> 
       <img flow-img="file" /> 
       </div> 
      </div> 
      </div> 
     </div> 
     <div> 
      <span class="btn btn-primary" flow-btn flow-files-submitted="$flow.upload()">Upload</span> 
     </div> 
     </div> 
    </div> 
    </div> 
    <div class="col-md-8" ng-show="{{ xxx.product_id }}"> 
    <form class="panel panel-default form-horizontal"> 
     <div class="panel-heading"> 
     <h3 class="panel-title">Infomation</h3> 
     </div> 
     <div class="panel-body"> 
     <div class="form-group"> 
      <label class="col-sm-2 control-label">Title</label> 
      <div class="col-sm-6"> 
      <input name="name" type="text" class="form-control" required> 
      </div> 
      <div class="col-sm-4"></div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-2 control-label">Description</label> 
      <div class="col-sm-6"> 
      <textarea class="form-control" rows="3" required></textarea> 
      </div> 
      <div class="col-sm-4">Write useful info e.g. appearance, purpose and recommendations</div> 
     </div> 
     </div> 
     <div class="panel-footer"> 
     <input type="hidden" name="product" value="{{ xxx.product_id }}"> 
     <button type="submit" class="btn btn-primary">Save changes</button> 
     </div> 
    </form> 
    </div> 
</div>

公告，xxx是什麼我也不知道，可能是服用點像$ flow.fileSuccess.message.product_id。

解決方案： 在控制器使用回調方法所推薦的回聲報

$scope.$on('flow::filesSubmitted', function (event, $flow, flowFile) 
    products.save($scope.product) 
    .$promise.then(function(result) { 
    $scope.product = result; 
    if ($scope.product.id) { 
     $flow.opts.target = apiUrl + '/products/' + $scope.product.id + '/images'; 
     $flow.upload(); 
    } 
    }); 
});

來源

2014-04-09 chakkit

歡迎來到StackOverflow，考慮添加一段代碼，以便其他開發人員可以更準確地指導您。 –

你不能直接訪問成功的消息，但你可以從回調訪問它。

flow-file-success=" ... properties '$file', '$message' can be accessed ... "

在HTML：

<div flow-file-success="success($message)">...

success - 應該是在你的控制器中定義的方法。將此消息分配給作用域，或以任何其他方式使用它。

來源

2014-04-14 13:00:12 Aidas

我使用這個答案，它用於獲取回調，但這是正常的$消息包含我的HTML頁面，而不是服務器響應？ – AlainIb

這在ng-flow文檔中很少記錄。我需要在控制器的某處可以訪問$ scope的地方訪問響應。文檔說這有關控制器捕獲事件： https://github.com/flowjs/ng-flow#how-can-i-catch-an-event-in-a-controller

「...... [該]第二個參數始終是一個流動的實例，然後如下事件的具體參數。」

所以我用這個角度控制器內部：

$scope.$on('flow::fileSuccess', function (event, $flow, $file, $message) { 
// $message is the json response from the post 
})

這似乎是工作。

來源

2015-10-05 21:00:58 sunilr

這工作完美！ – Gaurav

NG-flow.js，如何顯示HTML或控制器

回答

相關問題