角形のカスタムテンプレートのテンプレート

Question

をフィールドとして使用するangular-formlyライブラリ用のカスタムテンプレートを作成しようとしています。私が表示されるまで署名パッドを取得するための基本的なテンプレートメソッドを使用することができました：

app.run(function(formlyConfig) { 
    formlyConfig.setType({ 
     name: 'signaturePad', 
     template: '<signature-pad accept="accept" clear="clear"' + 
      'height="220" width="568"></signature-pad>' + 
      '<button ng-click="clear()">Clear signature</button>' + 
      '<button ng-click="signature = accept()">Sign</button>' 
    }); 
}); 

しかし、私がいる問題があることを受け入れるボタン一度戻り値を受け入れsignature変数メインコントローラのスコープではアクセスできません。

おそらく、問題の明確なバージョンは、次のようになります。

app.run(function(formlyConfig) { 
    formlyConfig.setType({ 
     name: 'helloWorldButton', 
     template: '<button ng-click="vm.clicked()">Sign</button>' 
    }); 
}); 

私は、アプリケーションのコントローラの内部の機能vm.clicked()にアクセスするにはどうすればよいです。フォーム自体はNG-コントローラのスコープ内で宣言されています

<div ng-controller="controllerName as ctrl">  
    <form ng-submit="ctrl.onSubmit()"> 
     <formly-form model="ctrl.userData" fields="ctrl.userFields"> 
      <button type="ctrl.submit">Submit</button> 
     </formly-form> 
    </form> 
</div> 

Answer 1

私が心配誰のために、仕事にこれを取得する別の方法を理解するために管理しました。

app.run(function(formlyConfig) { 
    formlyConfig.setType({ 
     name: 'signaturePad', 
     template: '<button ng-click="openSigPad()">Sign</button>', 
     controller: function($scope, $uibModal) { 
      ... 
      $scope.openSigPad = $uibModal.open(...); 
      .then(function(result) { 
       $scope.model[$scope.options.key] = result; 
      }); 
     } 
    }); 
}); 

この方法で、私はその中に必要なすべての情報を表示し、UIブートストラップを使用してモーダルを作成し、その後、バックフィールド自体のモデルへのモーダル結果を返します。よく働く。