簡體   English   中英

條件的HTML href屬性

[英]Html href attribute on the condition

我是web-development新手。 我正在使用angular-js這里,我有一個類似的功能,當我單擊一個按鈕時,我會收到來自后端的響應,如果是真的,那么我會將那個按鈕更改為下載按鈕。 因此,單擊此按鈕后,我正在執行ajax調用,並得到一個url ,可以使用該url下載相應的文件。 所以,這里我使用href來下載文件。所以,我關心的是當我單擊下載時,只有它應該獲取該URL,並且也可以通過使用href下載文件。

我的代碼就像-

HTML-

<button class="btn btn-labeled  btn-info" title= "{{ isAvaliable ? 'Download' : 'click to track'}}" ng-disabled="!file.processed" data-ng-click="performAction(file.attributes.name,file.attributes.cn, isAvaliable)">
         <a ng-href="{{url}}" target="_blank" ></a>
        <i ng-class="isAvaliable ? 'fa fa-download' : 'glyphicon glyphicon-text-width'" aria-hidden="true"></i>
</button>

調節器

$scope.performAction  = function(fileName, cn, isAvaliable) {
                        if(isAvaliable) {
                             $scope.downloadfile(fileName);
                        } else {
                            $scope.moveTofolder(fileName,cn);
                        }
  };

$scope.downloadfile = function(fileName) {
                    uploadService.downloadtracker(fileName)
                        .then(function (response) {
                            $scope.url = response.data;

                        },
                        function (error) {

                        })
                        .finally(function () {
                                                       }
                        );

           };

$scope.moveTofolder = function(fileName,cn) {
  // Here also I am calling some service and  I am getting response .\
  /// Here I am changing the button 
  $scope.isAvaliable = true;        
}

因此,由於href和downloadButton,在這里我遇到了一些問題。 因此,如何在下載單擊時調用函數並獲取URl,同時獲取該URL並在href中使用它,以便它也可以下載文件。 HrefdownloadButton的目的是相同的。

您只需要在按鈕中添加下載屬性

<button class="btn btn-labeled  btn-info" title= "{{ isAvaliable ? 'Download' : 'click to track'}}" ng-disabled="!file.processed" data-ng-click="performAction(file.attributes.name,file.attributes.cn, isAvaliable)" ng-click=“downloadfile
({{url}})”>
         <!— <a ng-href="{{url}}" target="_blank" ></a> —>
        <i ng-class="isAvaliable ? 'fa fa-download' : 'glyphicon glyphicon-text-width'" aria-hidden="true"></i>
</button>

在控制器中添加$ http

$scope.downloadfile = function(fileName) {
                //here I am calling a service and I am getting a responce which contains a url.
            $scope.$emit('download-start');

            $http.get(fileName).then(function(response) {
                $scope.$emit('downloaded', response.data);
            });

                    $scope.url =  responce.data;
               }

希望這對您有幫助

嘗試如下。 不要混入<a> and <button>因為您有按鈕單擊並且還錨定了單擊事件。

<a ng-href="{{url}}" ng-click="Download()" ></a>

$scope.Download = function(){
//some other code
window.open($scope.url);
}



 <button class="btn btn-labeled  btn-info" title= "{{ isAvaliable ? 'Download' : 'click to track'}}" ng-disabled="!file.processed" data-ng-click="performAction(file.attributes.name,file.attributes.cn, isAvaliable);downloadfile
(url)">

        <i ng-class="isAvaliable ? 'fa fa-download' : 'glyphicon glyphicon-text-width'" aria-hidden="true"></i>
</button>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM