Question

我正试图在纯角中实现类似bootstrap-file-uploader的东西。此引导扩展使用一致的备选（see this jsfiddle）替换默认的文件上载窗口小部件。

我无法在同一指令的另一个元素中显示所选的文件名。尝试了以下内容：

scope.fileName = files [0] .name
ngModel
范围。$适用。

触发事件并更改值，但更改未反映在界面中。

angular.module('app', [])
.directive('uploader', function() {
    return {
        restrict: 'E',
        template: '<div>filename: {{ fileName }}</div><input type="file">',
        scope: {},
        link: function(scope, el, attrs) {
            var file = el.find('input');
            scope.fileName = '?';
            file.bind('change', function(ev) {
                var files = event.target.files;
                scope.fileName = files[0].name;
                scope.$apply(function() {
                    scope.fileName = files[0].filename;
                });
                console.log(files, ev);
            });
        }    
    };
});

[UPDATE]

现在正在开展工作 - files[0].filename应为files[0].name。

Answer 1

答案就在那里，但没有在scope.$apply中实施。

修正：

scope.$apply(function() {
    scope.fileName = files[0].name;

在指令模板上显示输入[type = file]文件名

1 个答案: