0

我已经构建了一个需要动态更改模板的应用程序。

<div ng-include="templateUrl"></div>

我有两个模板，例如addtext.html和addmedia.html。我使用 angularjs 动态更改它。但在我的addmedia.html模板中，我有文件选择器的选择文件小部件。

<input type="filepicker" data-fp-apikey="..." data-fp-mimetypes="*/*" data-fp-container="modal" onchange="save_url()">

选择小部件不会加载到模板中。有什么办法让它工作吗？

4

1 回答 1

1

好吧，我对filepicker.io了解不多，但据我了解，问题在于小部件是在页面加载时构建的。这意味着当您切换模板时，filepicker可能不会自动处理它们，请参阅文档：

我们将自动转换您在页面加载时拥有的任何小部件。但是，如果您想在页面加载后创建小部件，您可以...调用filepicker.constructWidget();方法。

因此，我建议您使用一个简单的指令，只需使用 . 放置一个input标签type=filepicker，然后使用前面提到的方法将文件选择器链接到它，如下所示：

app.directive('myFilepicker', [function() {
    return {        
        transclude: true,
        restrict: "E",    
        template: '<input type="filepicker">',
        replace: 'true',
        link: function(scope, element) {
            filepicker.constructWidget(element);
        }
    };
}]);

在您的标记中，您可以像这样使用它：

<my-filepicker data-fp-apikey="..." data-fp-mimetypes="*/*" data-fp-container="modal" onchange="save_url()"></my-filepicker>

请参阅此演示。我没有 filepicker.io API 密钥，但我希望这能奏效。

于 2015-02-26T09:57:56.317 回答