AngularJSディレクティブで間違った関数が呼び出されました

Question

私は特定のファイルに対してバリデータを実行する2つの同様のディレクティブを持っています（DRYの原理に基づいているわけではないのでベストプラクティスではありません。 AngularJS）。

module.js

var $moduleExample = angular.module("$moduleExample", ["ngMaterial"]); 

$moduleExample.controller("testController", [ 
    "$scope", 
    function (
     $scope, 
    ) { 
     $scope.fileDialog = function() { 
      var el = angular.element("#file-dialog"); 
      el.trigger('click'); 
     }; 
    } 
]); 

$moduleExample.directive("validJson", function jsonValidFile() { 
    var validFormats = ['json']; 
    return { 
     require: 'ngModel', 
     link: function (scope, elem, attrs, ctrl) { 
      elem.on('change', function() { 
       var value = elem.val(), 
        ext = value.substring(value.lastIndexOf('.') + 1).toLowerCase(); 
       scope.isModelValid = validFormats.indexOf(ext) !== -1; 
      }); 
     } 
    }; 
}); 
$moduleExample.directive("validImage", function imageValidFile() { 
    var validFormats = ['jpg']; 
    return { 
     require: 'ngModel', 
     link: function (scope, elem, attrs, ctrl) { 
      elem.on('change', function() { 
       var value = elem.val(), 
        imageValue = attrs.validImage, 
        ext = value.substring(value.lastIndexOf('.') + 1).toLowerCase(); 
       scope.isImageValid = validFormats.indexOf(ext) !== -1; 
      }); 
     } 
    }; 
}); 

template.html

<div> 
    <md-button ng-click="fileDialog();"> 
     <md-icon md-font-set="material-icons">file_upload</md-icon> 
     upload json 
    </md-button> 
    <input id="file-dialog" type="file" class="ng-hide" valid-image on-file-change="handleImageFile" ng-model="image" /> 
</div> 
<div> 
    <md-button ng-click="fileDialog();"> 
     <md-icon md-font-set="material-icons">file_upload</md-icon> 
     upload image 
    </md-button> 
    <input id="file-dialog" type="file" class="ng-hide" valid-json on-file-change="handleJsonFile" ng-model="model" /> 
</div> 

番目のボタンが代わりに有効な-JSONの、正しいjsonフォーマットを検証する必要があり、有効な画像ディレクティブの関数が呼び出され、jpgに対して検証され。

handleImageFileおよびhandleJsonFile関数は、ファイルを読み取るだけです。

私には何が欠けていますか？

Answer 1

fileDialog関数では、ファイルダイアログ要素を参照しました。私は両方の指令で同じ識別子と機能を持っていたので、混乱しました。