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

-1

我正在创建一个Web客户端，将多个文件上传到Pinterest，纯粹是为了个人目的。前端是一个AngularJS，有一个文本框和一个文件上传元素kendo-ui。我多年来从未做过前端开发，也从不认真，对于单个页面，我现在不想开始。所以我主要是通过从多个地方复制粘贴来制作一个页面。如何使用文本字段的值来动态创建上传URL？

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

以下是我迄今为止所做的;我正在寻找的是将board的值附加到saveUrl，所以如果用户在文本框board中键入“无论”，saveUrl应该变为save/whatever。

<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>

来源

2017-09-09 Abhijit Sarkar

我自己解决了这个问题，不用道谢。

<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) 
    } 
    }); 
})();

来源

2017-09-10 00:36:28

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

回答

相关问题