unidades:09_directivas:02_scope

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="PruebaController">
    <ac-titulo-unidireccional texto="{{mensajeUnidireccional}}"></ac-titulo-unidireccional>
    
    <button ng-click="cambiarMensajeUnidireccional()">Cambiar valor del $scope.mensaje del controlador</button>
    <br>
    Valor del $scope.mensajeUnidireccional:<strong>"{{mensajeUnidireccional}}"</strong>
    
    <hr>
    
    <ac-titulo-bidireccional texto="mensajeBidireccional"></ac-titulo-bidireccional>
    
    <button ng-click="cambiarMensajeBidireccional()">Cambiar valor del $scope.mensaje del controlador</button>
    <br>
    Valor del $scope.mensajeBidireccional:<strong>"{{mensajeBidireccional}}"</strong>
    
  </body>

</html>

var app = angular.module("app", []);

app.directive("acTituloUnidireccional",[function() {
  
  var directiveDefinitionObject ={
    restrict:"E",
    replace : true,
    template:"<div><h1>{{texto}}</h1><button ng-click=\"texto='Texto cambiado desde dentro de la directiva'\">Cambiar valor de scope.texto de la directiva</button></div>",
    scope:{
      texto:"@"
    }
  }
  
  return directiveDefinitionObject;
}]);

app.directive("acTituloBidireccional",[function() {
  
  var directiveDefinitionObject ={
    restrict:"E",
    replace : true,
    template:"<div><h1>{{texto}}</h1><button ng-click=\"texto='Texto cambiado desde dentro de la directiva'\">Cambiar valor de scope.texto de la directiva</button></div>",
    scope:{
      texto:"="
    }
  }
  
  return directiveDefinitionObject;
}]);




app.controller("PruebaController", function($scope) {
  $scope.mensajeUnidireccional="Texto Unidireccional del controlador ";
  $scope.mensajeBidireccional="Texto Bidireccional del controlador "; 
  
  
  $scope.cambiarMensajeUnidireccional=function() {
    $scope.mensajeUnidireccional="Cambiado el texto Unidireccional del controlador ";
  }
  
  $scope.cambiarMensajeBidireccional=function() {
    $scope.mensajeBidireccional="Cambiado el texto Bidireccional del controlador"; 
  }
  
});

Ejemplo de scope de una directiva