1

Web サイトで Inspinia 管理テーマを使用しています。dropzone js を使用する ui ブートストラップ角度タブがあります。私はカスタム ディレクティブを使用し、コントローラーで現在のタブを更新することに成功したいと考えています。角度変数は正しく更新されますが、新しい値を表示するには、タブのどこかをクリックする必要があります。

HTML

 <tabset>
    <tab heading="Tab 1" ng-attr-active="vm.tabs[0].active">
       <div class="panel-body col-sm-12">
           <div ng-if="!vm.isResultsLoaded">
               <form class="dropzone" drop-zone="dropzoneConfig" id="dropzone">
                  <button id="submitFile" ng-click="vm.update()" type="submit" class="btn btn-primary pull-right">Submit this form!</button>
               </form>
            </div>
            <div class="table-responsive" ng-if="vm.isResultsLoaded">
                  <button class="btn btn-primary" ng-click="vm.switchToUpload()" type="submit">Ladda mer filer</button>
            <table class="table">
                        ...
            </table>
          </div>
       </div>
     </tab>
 </tabset>

指令

function dropZone() {
   return function (scope, element, attrs) {
      var config = scope[attrs.dropZone];

      // create a Dropzone for the element with the given options
      var dropzone = new Dropzone(element[0], config.options);

      // bind the given event handlers
      angular.forEach(config.eventHandlers, function (handler, event) {
         dropzone.on(event, handler);
      });
   };
}

コントローラ

 function tabListController(uploadService, $state, $scope) {
  ...

  $scope.dropzoneConfig = {
     "options": {
        "url": "/api/system/fileupload",
        "method": "post",
        "autoProcessQueue": false
     },
     "eventHandlers": {
        "addedfile": function (file, xhr, formData) {
           var myDropzone = this;
           $('#submitFile').click(function () {
               myDropzone.processQueue();
           });
        },
        "success": function (file, data) {
           vm.results = data;
           vm.isResultsLoaded = true;
        }
     }
  };
}

それを修正するために何をすべきか?

4

1 に答える 1