Question

我正在创建一个Web客户端，将多个文件上传到Pinterest，纯粹出于个人目的。前端是AngularJS，有一个文本框和kendo-ui的文件上传元素。多年来我没有做过前端开发，也从未认真对待过，对于单页，我现在不想开始。所以我把一个页面放在一起，主要是从多个地方复制粘贴。

也就是说，我遇到的问题是Kendo上传元素有一个saveUrl，顾名思义，它将所选文件发布到给定的URL。出于我的目的，并且为了忠于REST，我想通过在最后附加文本框的值来形成saveUrl。我不知道如何实现这一点，所以我们在这里。

以下是我到目前为止所做的事情;我正在寻找的是将board的值附加到saveUrl，因此如果用户在文本框board中键入“任意”，则saveUrl应该成为save/whatever {1}}。

<div id="main" ng-app="Pinterest">
    <div class="demo-section k-content" ng-controller="PinterestController">
        <div>
            <h4>Board Name</h4>
            <input type="text" id="board" name="board" class="k-textbox" required style="width: 400px;"/>
        </div>
        <div style="padding-top: 2em;">
            <h4>Upload files</h4>
            <input name="files"
                   type="file"
                   kendo-upload
                   k-async="{ saveUrl: 'save', removeUrl: 'remove', autoUpload: false }"
            />
        </div>
    </div>
    <script>
    angular.module("Pinterest", ["kendo.directives"])
        .controller("PinterestController", function($scope){
        })


    </script>
</div>

Answer 1

我自己解决了这个问题，不，谢谢这里的任何人。

<body>
<div id="main" ng-app="pinterest">
    <div class="demo-section k-content" ng-controller="PinterestController">
        <div>
            <h4>Board Name</h4>
            <input type="text" id="board" name="board" class="k-textbox" required style="width: 400px;"
                   ng-model="modelObj.board"/>
            <p class="demo-hint">Will be created if doesn't exist</p>
        </div>
        <div style="padding-top: 2em;">
            <h4>Upload files</h4>
            <input name="files"
                   type="file"
                   kendo-upload
                   k-async="{ saveUrl: 'pinterest/{board}', autoUpload: false }"
                   k-upload="onUpload"
            />
        </div>
    </div>
</div>
<script src="js/app.js"></script>
</body>

<强> app.js ：

(function() {
  var app = angular.module("pinterest", ["kendo.directives"]);
  app.controller("PinterestController", function($scope) {
    $scope.modelObj = {
      board: $scope.board
    };
    $scope.onUpload = function(e) {
      var saveUrl = e.sender.options.async.saveUrl;
      e.sender.options.async.saveUrl = saveUrl.replace("{board}", $scope.modelObj.board)
    }
  });
})();

如何使用文本字段的值动态创建上传URL？

1 个答案: