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;
}
}
};
}
それを修正するために何をすべきか?