Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
branch: master
73 lines (52 sloc) 2.249 kB
<!--
Here we demonstrate that even though we use 'isolated scope',
there is still a way to change it/isolated-scope from withing parent scope.
It behaves pretty much as it was marked with "scope:false" (prototypical inheritance is used)
-->
<!DOCTYPE html><html><head>
<script src="../../javascripts/jquery-2.0.3.js" type="text/javascript"></script>
<script src="../../javascripts/angular-1.2.0-rc.3/angular.js" type="text/javascript"></script><script>
var app = angular.module("app", []);
// Ctr.
app.controller("AppCtr", ["$scope", function($scope) {
$scope.version = "App 1.0"
$scope.subversion = "0.0"
$scope.setAppVersion = function(aVersion, aSubversion) {
$scope.version = aVersion;
$scope.subversion = aSubversion;
}
}]);
// Directive
app.directive('myScopedDirective', function() {
return {
scope : {
'version' : '@version',
'subversion' : '@subversion'
},
link : function ($scope, $element, $attrs) {
$scope.setDirectiveVersion = function (aVersion) {
$scope.version = aVersion;
};
$scope.setDirectiveSubVersion = function (aSubVersion) {
$scope.subversion = aSubVersion;
};
}
};
});
</script></head>
<!--- --->
<body ng-app="app">
<div ng-controller="AppCtr">
<h2>version: {{version}} </h2>
<h2>subversion: {{subversion}} </h2>
<button ng-click ="setAppVersion('App 2.0', '1.1')">Upgrade app version!</button > <!-- controller.setAppTitle(...) -->
<div my-scoped-directive
version =" The directive, within the app {{version}}"
subversion="{{subversion}}"> <!-- here we are passing references to the PARENT scope variables !!! So from that point it will behave as Prototypical Inheritance -->
<h4>{{version}}, {{subversion}} </h4>
<button ng-click="setDirectiveVersion('d-version-value')"> D1 </button>
<button ng-click="setDirectiveSubVersion('d-subversion-value')"> D2 </button>
</div>
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.