如何使用文件上载字段扩展angular-xeditable可编辑行

时间:2015-06-02 14:20:02

标签: angularjs file upload

我正在尝试扩展(我的真实示例非常相似)angular-xeditable - 可编辑行 - 此处描述的示例: http://vitalets.github.io/angular-xeditable/#editable-row 或者它的jsFiddle链接在这里: http://jsfiddle.net/NfPcH/93/

所以我有一个额外的列用于上传每个行/项目的文件。如果它可以只是类型文件的输入元素,那很好,但我打开其他解决方案。通常,我的专栏看起来像这样:

                <td>
                    <span editable-text="template.description" e-name="description" e-form="rowform" e-required>
                        {{ template.description || 'empty' }}
                    </span>
                </td>

但是,现在我想添加我的自定义列,并尝试使用或不使用所有提到的属性的输入元素:

                <td>

                    <input id="file"
                           accept="application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                           ng-show="rowform.$visible"
                           class="btn btn-default"
                           name="file"
                           type="file"
                           e-name="file"
                           e-form="rowform"
                           value="{{ user.file || 'empty' }}" />
                </td>

在任何情况下,执行此代码后,在尝试保存行后,我无法在我的角度控制器中获取 - file - 值:

    $scope.saveUser = function (data, id) {
        //$scope.user not updated yet
        angular.extend(data, { id: id });
        angular.extend(data, { file: file });
        return $http.post('/saveUser', data);
    };

我的 - 数据 - 对象在这里与所有其他属性,如 - 描述 - 但没有 - 文件 - 属性!

当然,我使用以下内容扩展了onbeforesave事件:

... form editable-form name =&#34; rowform&#34; onbeforesave =&#34; saveTemplate($ data,user.id,user.file)&#34; ...

有什么建议吗?

谢谢, 韦德兰

1 个答案:

答案 0 :(得分:0)

我坚持这个。

当我认为一切都很好,因为我通过使用解决方案创建了这里提到的自定义指令,在我的角度模型中得到了文件对象:

ng-model for <input type="file"/>

......然后新的问题开始困扰我。

我无法在绑定过程中将此文件对象映射到MVC控制器的HttpPostedFileBase参数。

我尝试了所有方法,例如排除属性并向我的MVC控制器添加单独的参数,或创建自定义MVC模型绑定器,但我看到使用的ModelBinderResult类,我无法在任何命名空间中的MVC 5类中找到它。

这个File对象肯定在这里,但我无法使它工作。我知道该对象不为空或为null,因为如果我指定控制器的类型输入参数=&gt;对象,那么它不是空的。

拜托,欢迎任何帮助!

韦德兰