javascript - 似乎没有使用元素中传入的选项执行 Angular 指令

Question

我在 JSFiddle 上托管了一个简单示例其中包括一个 Angular Directive(指令) angularbfi 来包装 bootstrap-forminput by https://github.com/kartik-v/bootstrap-fileinput .

相关指令的代码是，

(function () {
'use strict';

angular
    .module('angularBootstrapFileinput', [])
    .directive('angularBfi', angularBootstrapFileinput);

function angularBootstrapFileinput() {
    var directive = {
        restrict: 'A',
        scope: {
            options: '=angularBfi',
            watchOptions: '@?watchOptions'
        },
        link: linkFunc,
        controller: AngularBootstrapFileinputController,
        controllerAs: 'vm',
        bindToController: true
    };

    return directive;

    function linkFunc(scope, element) {
        element.fileinput(scope.vm.options);
        scope.vm.refresh = refresh;
        activate();

        function activate() {
            if (scope.vm.watchOptions){
                scope.$watch('vm.options', refresh, true);
            }
        }
        function refresh() {
            element.fileinput('refresh', scope.vm.options);
        }
    }
}

function AngularBootstrapFileinputController(){
    var vm = this;
    vm.watchOptions = angular.isDefined(vm.watchOptions) && vm.watchOptions === "true";
}
})();

我似乎无法将 {'showUpload':false, 'showPreview':false} 传递给它。我在这里可能做错了什么？

附上代码。 https://jsfiddle.net/nixgadget/paad9w41/

Answer 1

原来它没有加载是因为指令是驼峰式 angularBfi 输入属性必须是 angular-bfi

因此，

<input type="file" class="file" name="upload" data-show-preview="false"  data-show-upload="false" />

我也更新了https://jsfiddle.net/nixgadget/paad9w41/2/