无法打开图片模式

Question

弹出我的模态没有出现，页面路由到其他页面，没有看到代码中的任何问题，相同的代码在其他模块中运行完美。只想点击HTML代码时才打开图片模式。

//controller Code

'use strict';
angular.module('employer-company').controller('EmployerProfileController', ['$scope','$http', 'Countries', 'Authentication','Employers', '$location','$modal',
function($scope,Countries,$http, Authentication, Employers, $location, $modal) {
    $scope.user = Authentication.user;
    $scope.countries = Countries.getCountries();
    $scope.isEditing = false;

    $scope.openPictureModal = function() {
    var modalInstance;
    modalInstance = $modal.open({
      templateUrl: '/modules/employer-company/views/picture-partial.html',
      controller: 'PictureModalCtrl',
    });
    modalInstance.result.then(function(result) {
       $scope.employer.picture_url = result.picture_url;
    }, function() {

    });
  };
   }

 ]).controller('PictureModalCtrl', [
  '$scope', '$modalInstance', '$upload', function($scope, $modalInstance, $upload) {

     var convert = function convertDataURIToBlob(dataURI, mimetype) {
      var BASE64_MARKER = ';base64,';
      var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
      var base64 = dataURI.substring(base64Index);
      var raw = window.atob(base64);
      var rawLength = raw.length;
      var uInt8Array = new Uint8Array(rawLength);

      for (var i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
      }

      var bb = new Blob([uInt8Array.buffer], {type : mimetype});


      return bb;
    }

  $scope.upload = function(image){

        $scope.formData = convert(image.dataURL, image.type);

        $scope.upload = $upload.upload({
        url: '/uploadpicture', //upload.php script, node.js route, or servlet url

        method: 'POST',

        headers: {'Content-Type': 'undefined'},

        data: {myObj: $scope.myModelObj},
        file: $scope.formData, // or list of files ($files) for html5 only

      }).progress(function(evt) {
        console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
      }).success(function(data, status, headers, config) {

        $scope.response = data;
        console.log(data);
        $modalInstance.close({picture_url: data});
      });
  };

$scope.ok = function (action) {
$modalInstance.close({ action: action, picture_url: $scope.picture_url });
};

$scope.cancel = function () {
$modalInstance.dismiss('cancel');

};
 }
 ]);

    //modal code

    <div style="padding: 10px;">

<h2>Make sure you look good.</h2>
<div>
    <span class="btn btn-default btn-file">
        Browse
        <input id="inputImage2"
            type="file" 
            accept="image/*" 
            image="image2" 
            resize-max-height="300"
            resize-max-width="250"
            resize-quality="0.9" />
    </span>
    <hr />
    <img width="250" ng-src="{{image2.resized.dataURL}}"/>

</div>
<br>
<div style="display: flex; align-items: center;">
    <button class="btn btn-primary" ng-click="upload(image2.resized)">Upload</button>
    <button class="btn btn-success" ng-click="cancel()">Cancel</button>
</div>

<hr />
</div>

// HTML code

 <div class="col-md-3 text-center">
                <a href="" class="pull-right" ng-show="isEditing" ng-click="openPictureModal()" >   <i class="fa fa-edit"></i></a>
                <img alt=""class="img180_180" src="{{employer.picture_url}}">
  </div>