<commit_before>tg-dynamic-directive
====================

A simple directive to dynamically load proper view, based on the characteristics of the provided model.

#Usage

```html
<div ng-repeat="pagePart in pageParts">
  <tg-dynamic-directive ng-model="pagePart" tg-dynamic-directive-view="getView">
  </tg-dynamic-directive>
</div>
```

```js
myapp.controller('myController', function ($scope) {
  $scope.pageParts = [{
    title: 'My Title',
    type: 'title'
  }, {
    title: 'Section 1',
    type: 'section'
  }, {
    title: 'Section 2',
    type: 'section'
  }]

  $scope.getView = function(item) {
      if (item.type === 'title') {
        return 'titleView.html';
      } else if (item.type === 'section') {
        return 'sectionView.html';
      }
      return null;
  };
});
```

#Examples

* [Sortable tree with dynamic template](http://codepen.io/thgreasi/pen/uyHFC)
* [Sortable tree with dynamic changing template](http://codepen.io/thgreasi/pen/emBJQL)<commit_msg>docs(README): add more example code<commit_after>tg-dynamic-directive
====================

A simple directive to dynamically load proper view, based on the characteristics of the provided model.

#Usage

```html
<!-- Directly pass a string with the view -->
<tg-dynamic-directive ng-model="headerModel" tg-dynamic-directive-view="'headerView.html'">
</tg-dynamic-directive>

<!-- Use a function that is called with the ng-model as a parameter -->
<div ng-repeat="pagePart in pageParts">
  <tg-dynamic-directive ng-model="pagePart" tg-dynamic-directive-view="getView">
  </tg-dynamic-directive>
</div>

<!-- Get the view from a property of an object -->
<tg-dynamic-directive ng-model="footerModel" tg-dynamic-directive-view="footerModel.view">
</tg-dynamic-directive>
```

```js
myapp.controller('myController', function ($scope) {
  $scope.headerModel = { title: 'Header title' };

  $scope.pageParts = [{
    title: 'My Title',
    type: 'title'
  }, {
    label: 'Section 1',
    type: 'section'
  }, {
    label: 'Section 2',
    type: 'section'
  }]
  
  $scope.footerModel = {
    copyright: 'tg©',
    view: 'footerView.html'
  };

  $scope.getView = function(item) {
      if (item.type === 'title') {
        return 'titleView.html';
      } else if (item.type === 'section') {
        return 'sectionView.html';
      }
      return null;
  };
});
```

The parameter passed to `ng-model` is available to the `$scope` of the included view as `ngModelItem`.
```html
<script type="text/ng-template" id="headerView.html">
  <h1> {{ ngModelItem.title }} </h1>
</script>
```

#Examples

* [Sortable tree with dynamic template](http://codepen.io/thgreasi/pen/uyHFC)
* [Sortable tree with dynamic changing template](http://codepen.io/thgreasi/pen/emBJQL)
{'fraction_non_alphanumeric': 0.1759766338079591, 'fraction_numerical': 0.002190580503833516, 'mean_word_length': 3.6440677966101696, 'pattern_counts': {'":': 0, '<': 22, '<?xml version=': 0, '>': 22, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4749573', 'n_tokens_mistral': 915, 'n_tokens_neox': 888, 'n_words': 222}