私が使用してモーダルを表示する成分（親要素）を有するJS角度成分

Question

に関数を渡す：

showModal() { 
    this.modalInstance = this.modal.open({ 
     template: "<upload-modal on-close='$ctrl.closeModal()'></upload-modal>" 
    }); 
} 

これはアップロードコンポーネント（子要素）のためのコードである：

import uploadController from "./upload.controller"; 
export const UPLOAD_COMPONENT_NAME = "uploadModal"; 

export const uploadComponent = { 
    templateUrl: "templates/profile/upload-image.html", 
    controller: uploadController, 
    bindings: { 
    'onClose': "&" 
    } 
}; 

これは、私は（アップロード-image.html）機能をOnCloseの呼び出し方法：

<div class="modal-content"> 
<form id="addReview" name="addReview" role="form" class="form-horizontal"> 
    <div class="modal-header"> 
     <button type="button" ng-click="$ctrl.onClose()" class="close"><span 
       aria-hidden="true">×</span><span class="sr-only">Close</span></button> 
     <h4 id="myModalLabel" class="modal-title">Upload your profile image</h4> 
    </div> 
    <div class="modal-body"> 
     <input id="input-id" type="file" class="file" data-preview-file-type="image"> 
    </div> 
    <div class="modal-footer"> 
     <button ng-click="$ctrl.onClose()" type="button" class="btn btn-default"> 
      Cancel 
     </button> 
     <button type="submit" class="btn btn-primary">Update</button> 
    </div> 
</form> 

ただし、親コンポーネントのcloseModal関数は呼び出されません。私はここで間違って何をしていますか？

Answer 1

あなたはそれが呼び出し

の変化だ、コンポーネントに関数を渡す必要はありません：あなたが投稿します場合にも役立つだろう

template: "<upload-modal on-close='$ctrl.closeModal'></upload-modal>" 

：この中

template: "<upload-modal on-close='$ctrl.closeModal()'></upload-modal>" 

この関数を適切に呼び出すかどうかを確認してください。 この

if ($ctrl.closeModal && angular.isFunction($ctrl.closeModal()) { 
    $ctrl.closeModal()(anyValueYouWantToPass); 
} 

ような何かPS

UI-ブートストラップモーダルはすでにlifecycle callbacks as promisesを返すべきであり、open方法はモーダルオブジェクトを返す、（タイプを閉じて、それのプロパティの1つが

です：promise） - モーダルが閉じられ、アニメーションが完了すると解決されます。