我想在html页面上显示上传的文件名

时间:2015-09-03 07:40:47

标签: angularjs ruby-on-rails-4 ionic ionicpopup

  1. 当我点击它时,我的新消息部分中有附件 附件我弹出上传文件,在我的新留言中 我想在新的消息html页面上显示该文件名。
  2. 这是我的app.js文件

    function newMsgController($scope, $http,$ionicPopup, $rootScope, $location, message) {
        //alert($location.search().MID);
        //$scope.showErrorMessage = false;
        // $scope.upload = function(el) {
        // alert
        // };
        $scope.submit = function() {
            alert($("#FILEID").value);
            //$scope.showErrorMessage = false;
            message.newMessage(window.localStorage['token'], $scope.subject, $scope.body, $scope.image).success(function(data) {
                alert("Message Sucessfully Sent");
            });
    
        };
        $scope.data = {}
    
      // Triggered on a button click, or some other target
      $scope.showPopup = function() {
         var myPopup = $ionicPopup.show({
         template: '<input type="file"  name="file"  ng-model="data.image">',
         title: 'Browse the file',
         scope: $scope,
         buttons: [
           { text: 'Cancel' },
           {
             text: '<b>Upload</b>',
             type: 'button-positive',
             onTap: function(e) {
                alert(JSON.stringify(e));
               if (!$scope.data.image) {
                return $scope.data.image;
               } 
             }
           },
         ]
       });
       myPopup.then(function(res) {
         console.log('Tapped!', res);
       });
       $timeout(function() {
          myPopup.close(); //close the popup after 3 seconds for some reason
       }, 3000);
      };
    };
    

    这是我的newMsg.html页面

    <ion-header class="bar bar-header bar-balanced">
        <!-- <button class="button button-icon icon ion-navicon"></button> -->
        <a href="#/dashboard" class="button icon-left ion-chevron-left button-clear "></a>
        <!--<button class="button back-button button-icon icon ion-arrow-left-c button back-button button-icon icon ion-arrow-left-c" ng-click="goBack($event)" ng-class="{'hide': !backButtonEnabled}" icon="backIcon" label="backLabel" type="backType" ng-if="(backType || backLabel || backIcon)" style=""> </button>-->       
        <h3 style="margin-left: 4%; line-height: 0px;">Compose</h3>
    
    </ion-header>
    <div class="padding" >
        <ion-content class="content has-header ionic-pseudo" style="margin-top:19px">
            <div ng-controller="newMsgController">
                <form>
                    <div class="col-md-12 violet">
                        <div class="col-md-4 col-xs-4"> <a href="#/myMessages">
                                <i class="icon ion-close-round"></i>
                                Discard
                            </a></div>
                        <div class="col-md-4 col-xs-4"> 
                        <a href="">
                               <i ng-click="showPopup()" class="icon ion-paperclip"> &nbsp;Attach</i>
                               </a>
                            </div>
                        <div class="col-md-4 col-xs-4"> <a href="" ng-click="submit()">
                                <i class="icon ion-paper-airplane"></i>
                                Send        
                            </a>
                        </div>
                        <div style="clear:both"></div>
                    </div>
                    <div class="list">
                        <label class="item item-input">
                            <input type="text" placeholder="Subject" ng-model="subject">
                        </label>
                        <label class="item item-input">
                            <textarea placeholder="Message" ng-model="body"></textarea>
                        </label>
                    </div>
                </form>
            </div>
        </ion-content>
    </div>
    <div style="clear:both"></div>
    

0 个答案:

没有答案