scope.$evalで引数を設定する方法

参考: https://docs.angularjs.org/api/ng/service/$parse

「angular.jsでng-initのような式評価を使う」の続き的な所として、scope.$eval(attrs.ngCall)をすればng-initのような式評価で実行させる事が出来るっていうのは前回で書いたが、例えばそのngCallで呼び出される$scope等に定義した関数等の場合に引数にdone等のようななんらかの処理を完了させるようなコールバックを引数に渡せるようにしたいとかっていう要件な場合な件を調査してみた

index.html

<html ng-app="sample">
  <head>
    <script src="angular.min.js"></script>
    <script src="main.js"></script>
  </head>
  <body>
    <div ng-controller="SampleController">
      <!-- doneっていう変数を利用できるようにしてそれをコールする事で完了処理を内部的に行う -->
      <div ng-call="say(done)">click</div>
    </div>
  </body>
</html>

scope.$evalを使う場合

angular.module("sample", [])
  .directive("ngCall", function() {
    return {
      compile: function() {
        return {
          pre: function(scope, element, attrs) {
            element.bind("click", function() {
              scope.$eval(
                attrs.ngCall,
                {
                  done: function() {
                    console.log("done");
                  }
                }
              );
            });
          }
        };
      }
    };
  })
  .controller("SampleController", function($scope) {
    $scope.say = function(done) {
      done();
    };
  });

な感じでscope.$evalの引数にコンテキストオブジェクトで指定すれば良いっぽい

$parseを使う場合

angular.module("sample", [])
  .directive("ngCall", function($parse) {
    return {
      compile: function() {
        return {
          pre: function(scope, element, attrs) {
            element.bind("click", function() {
              var fn = $parse(attrs.ngCall);
              fn(
                {
                  done: function() {
                    console.log("done");
                  }
                },
                scope
              );
            });
          }
        };
      }
    };
  })
  .controller("SampleController", function($scope) {
    $scope.say = function(done) {
      done();
    };
  });

っていう感じで$parseを使ってattrs.ngCallしたのをコールする際にコンテキストオブジェクトを第1引数で指定すればいいっぽい

んまぁんな感じで