第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

AngularJs:如何檢查文件輸入字段中的更改?

AngularJs:如何檢查文件輸入字段中的更改?

精慕HU 2019-07-04 12:57:33
AngularJs:如何檢查文件輸入字段中的更改?我對角不熟悉。我試圖從HTML‘file’字段讀取上傳的文件路徑,每當該字段發(fā)生“更改”時。如果我使用“onChange”,它會起作用,但當我用角度方式使用“ng-Change”時,它就不起作用了。<script>    var DemoModule = angular.module("Demo",[]);    DemoModule .controller("form-cntlr",function($scope){    $scope.selectFile = function()    {         $("#file").click();    }    $scope.fileNameChaged = function()    {         alert("select file");    }});</script><div ng-controller="form-cntlr">     <form>          <button ng-click="selectFile()">Upload Your File</button>          <input type="file" style="display:none"                            id="file" name='file' ng-Change="fileNameChaged()"/>     </form>  </div>fileNameChage()從來不打電話。Firebug也不會顯示任何錯誤。
查看完整描述

3 回答

?
揚帆大魚

TA貢獻1799條經(jīng)驗 獲得超9個贊

我做了一個小指令來偵聽文件輸入的更改。

查看JSFiddle

view.html:

<input type="file" custom-on-change="uploadFile">

js:

app.controller('myCtrl', function($scope){
    $scope.uploadFile = function(event){
        var files = event.target.files;
    };});

js:

app.directive('customOnChange', function() {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
      var onChangeHandler = scope.$eval(attrs.customOnChange);
      element.on('change', onChangeHandler);
      element.on('$destroy', function() {
        element.off();
      });

    }
  };});


查看完整回答
反對 回復 2019-07-04
?
森林海

TA貢獻2011條經(jīng)驗 獲得超2個贊

這是對其他一些模型的改進,數(shù)據(jù)將以ng模型結(jié)束,這通常是您想要的。

標記(只需創(chuàng)建一個屬性數(shù)據(jù)文件,以便指令能夠找到它)

<input
    data-file
    id="id_image" name="image"
    ng-model="my_image_model" type="file">

JS

app.directive('file', function() {
    return {
        require:"ngModel",
        restrict: 'A',
        link: function($scope, el, attrs, ngModel){
            el.bind('change', function(event){
                var files = event.target.files;
                var file = files[0];

                ngModel.$setViewValue(file);
                $scope.$apply();
            });
        }
    };});


查看完整回答
反對 回復 2019-07-04
  • 3 回答
  • 0 關(guān)注
  • 574 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號