Angular js com diretivas

Angular js com diretivas

• 1.
  Arquitetando aplicações com Diretivasem AngularJS por Matheus Lima
• 2.
  Motivação Reuso Manutenção ng-controller Components são ofuturo
• 3.
  Reuso Paginação com Diretivas: <paginationpages="pages"></pagination> Alternativa com controllers: <div ng-controller="PaginationCtrl"> <div ng-include="'/shared/pagination.html'"></div> </div>
• 4.
  Manutenção JavaScript não-obstrusivo nãoé tão bom quanto pensávamos. Componentes possuem todo o código no mesmo lugar: function Pagination() { return { restrict: 'E', template: '<nav>...</nav>', scope: { page: '=' } }; }
• 5.
  ng-controller 1. Compartilhamento dedados 2. Repetição de código 3. Herança
• 6.
  ng-controller 1. Compartilhamento dedados A forma mais comum usa $scope ou $rootScope (deprecated) Por não possuir escopo isolado é mais difícil de: Entender Manter Testar Exemplo no jsfiddle
• 7.
  ng-controller 2. Repetição decódigo Justamente por ser difícil o Reuso, o DRY é comprometido
• 8.
  ng-controller 3. Herança A formamais comum: function MyController() { ... $scope.$parent.invokeMethod(); } Usa $scope e $parent…. JUNTOS Exemplo no jsfiddle
• 9.
  ng-controller Portanto: “Se uma featurede uma linguagem pode ser problemática, e se ela pode ser substituída por outra feature que é mais confiável, então sempre escolha a feature mais confiável.” - Douglas Crockford
• 10.
  Components são ofuturo Mesmo que você não acredite em nada do que eu falei: Angular 2 React Ember Aurelia Todos os frameworks estão focando em Components.
• 11.
  Perguntas