why does my directive throws $unknown provider
<p>unknown provider  error:
 [$injector:unpr] <a href="http://errors.angularjs.org/1.4.3/" rel="nofollow">http://errors.angularjs.org/1.4.3/</a>$injector/unpr?   p0=postbuttonsProvider%20%3C-%20postbuttons%20%3C-%20RandomBusinessCtrl</p>

<p>here is my code : the directive is defined as follows :</p>

<pre><code>angular.module('home', ['ngAnimate', 'ui.bootstrap','ngDialog'])

.directive("postbutton", function(){
return {
    restrict: "E",
    bindToController: true,
    template: "&lt;button&gt;Post review&lt;/button&gt;"        
}
})

.controller('RandomBusinessCtrl', 
    ['$scope','postbutton','pickRandomBusinesses','BusinessViewModel','config',
    function ($scope,postbutton,pickRandomBusinesses,BusinessViewModel,config) {

    });
</code></pre>

<p>my html is :</p>

<pre><code>&lt;div ng-controller="RandomBusinessCtrl"&gt;
&lt;span class="badge pull-right" style="background-color:#CB525B;" &gt;
      &lt;postbuttons&gt;&lt;/postbuttons&gt;
    &lt;!-- &lt;button type="button" value="post_business" style="background-color:#CB525B; height:15px;border:0px;`" ng-click="postReview(random_business.id,user_id,rate,price,date_created,details)"&gt;Post review&lt;/button&gt; --&gt;
  &lt;/span&gt;
</code></pre>

<p></p>