directiveのmultiElement

2014-07-25T00:00:00+00:00 angular.js JavaScript

<!DOCTYPE html>
<html ng-app="sample">
  <head>
    <script src="https://code.angularjs.org/1.3.0-beta.16/angular.js"></script>
    <script src="app.js"></script>
  </head>
  <body ng-controller="SampleCtrl">
    <div directive1-start></div>
    <div directive1-end></div>
  </body>
</html>

みたいなのがあった場合において

angular.module("sample", [])
  .directive("directive1", function() {
    return {
      link: function(scope, element, attrs) {
        // 処理されない
      }
    };
  })
  .controller("SampleCtrl", function() {
  });

っていう事になるらしい。書いてる通りlinkで指定されてるところは処理されない

なぜかというと、directiveを同一スコープ?を複数処理する場合においてはmultiElementオプションを設定しなければ処理されないようになるらしい。ちなみにこれ 1.3.x系(現時点ではまだベータ版)ので動かしているが1.2.x系を使えば普通に動く

つまり今後そういうdirectiveを書く要件があるような場合においては

angular.module("sample", [])
  .directive("directive1", function() {
    return {
      multiElement: true,
      link: function(scope, element, attrs) {
      }
    };
  })
  .controller("SampleCtrl", function() {
  });

というようにmultiElementの設定をしないといけない模様

詳しいことは https://github.com/angular/angular.js/commit/e8066c4b4ce11496b0d8f39e41b4d753048bca2d を見るべし(公式ドキュメントには記載されていない?)

まぁそういう風な仕様の変更がある模様なのでメモ

strong parameters Railsのconcernsについて