title: Adding a new Angular Dependancy
body: <p>I'm new to angular and I think I'm doing this right but I'm not sure. I just got pushed into a project without much help and I'm trying to figure this out. I need to make some data using a tree view. The old code was using ng-repeat so I need to do something like that. I found a library that can help with that called treeRepeat. I have 0 experience using npm or bower so I just downloaded "module.js" and "tree-repeat.js" and added it to the project and then added it to a bundle and called it in my html page but I get a error injecting module error and I can't figure out why.</p>
  
  <p>I have the error link at bottom but its a huge link and I have no idea on how to hyperlink it.</p>
  
  <p>App.js</p>
  
  <pre><code>var app = angular.module('app', ['angularFileUpload', 'ngSanitize', 'ui.mask', 'ui.select', 'ui.bootstrap', 'ui.bootstrap.tpls', 'angular.filter', 'smart-table', 'colorpicker.module', 'sf.treeRepeat'])
      .config(function ($httpProvider) {
          //make delete type json to facilitate passing object
          //to our generic method.
          $httpProvider.defaults.headers["delete"] = {
              'Content-Type': 'application/json;charset=utf-8'
          };
      });
  </code></pre>
  
  <p>EDIT: New error when I changed the bundle order. It now goes jquery first, treerepeat, and then angularjs.</p>
  
  <p><a href="https://docs.angularjs.org/error/" rel="nofollow">https://docs.angularjs.org/error/</a>$injector/nomod?p0=sf.treeRepeat</p>
  
  <p>Calling code:</p>
  
  <pre><code>&lt;div class="row"&gt;
        &lt;ul&gt;
           &lt;li sf-treepeat="role in vm.roles"&gt;
               {{role.RoleName}}
               &lt;ul&gt;
                  &lt;li sf-treecurse&gt;&lt;/li&gt;
               &lt;/ul&gt;
           &lt;/li&gt;
       &lt;/ul&gt;
  </code></pre>
  
  <p></p>
  
  <p>Bundle Order (The 2 files I added with tree-repeat are at the end of the angularjs bundle:</p>
  
  <p>@section scripts {</p>
  
  <pre><code>@Scripts.Render("~/bundles/manageUser")
  @Scripts.Render("~/bundles/jquery")
  @Scripts.Render("~/bundles/angularjs")
  
  &lt;script&gt;
      $(document).ready(function () {
          $('[data-toggle="tooltip"]').tooltip();
      });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>}</p>