Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <div ng-controller="MainController">
    <parent-directive><parent-directive>
  </div>
</body>
</html>
 
angular.module('myApp',[])
.controller('MainController',function($scope){
  $scope.mainCtrlMethod = function(val){
        alert(val);
  }
})
​
.directive('parentDirective', function(){
  return{
    restrict: 'E',
    repace: true,
    template: '<div><p ng-click="parentMethod(\'parent method\')">parent directive</p>' +
    '<br/>' +
    '<son-directive></son-directive>',
    link: function(scope, elm, att){
      scope.parentMethod = function(val){
        alert(val);
      }
    }
  }
})
​
.directive('sonDirective', function(){
  return{
    restrict: 'E',
    scope: {},
    replace: true,
    template: '<p ng-click="mainCtrlMethod(\'son says\')">son directive</p>',
    controller: 'MainController'
  }
})
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
ArielMashrakipro
0viewers