<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Example - example-ng-click-production</title>
  <script src="//code.angularjs.org/snapshot/angular.min.js"></script>
  <script src="script.js"></script>

</head>

<body ng-app="myApp">
  <div ng-controller="myController">
    <partload cancel-func="stop(id)" name="vm.name"></partload>
  </div>
  <script>
    var app = angular.module('myApp', ['commonDirective'])
    app.controller("myController", function($scope) {
      var vm = $scope.vm = {
        name: 'myName'
      }
      $scope.stop = function(id) {
        alert(id)
      };
    })
  </script>
</body>

</html>

<!-- 
Copyright 2017 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
-->
angular.module('commonDirective', [])
  .directive("partload", function() {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        name: "=",
        cancelFunc: "&"
      },
      template: '<section><p>name: {{ name }}</p><p ng-click="_cancelFunc()">click here</p></section>',
      link: function(scope, elem, attrs) {
        scope._cancelFunc = function() {
          // 这里可以写一些指令内部逻辑
          // { id : "id form directive" } 传参
          scope.cancelFunc({
            id: "id form directive"
          }); 
        }
      }
    }
  })
/* Styles go here */