title: ng-click not working after first click (embedded directives)
body: <p>I'm having issues with a button and ng-click. I have an input and a button with and ng-click that when click generates 3 random words. I display this words in a div generated by a directive.</p>
  
  <p>The problem I'm having is that when I click the button the first time the code runs perfectly, but when I click again, the button does nothing, I had to implement a clear button that clears the $scopes and then the generate button works again.</p>
  
  <p>This is the code for my button:</p>
  
  <pre><code>&lt;button class="btn btn-default" type="button" ng-click='generateRandom()'&gt;Generate&lt;/button&gt;
  </code></pre>
  
  <p>Here is the code for the directive:</p>
  
  <pre><code>&lt;div jz-tabs camel='camel' snake='snake' kebab='kebab'&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The <code>$scope.generateRandom()</code>:</p>
  
  <pre><code>$scope.generateRandom = function() {
    var temp = '';
    Words.getWords($scope.number)
    .then(function(response) {
      console.log(response);
      response.data.forEach(function(e) {
        console.log(e);
        temp += ' ' + e.word;
      });
  
      $scope.camel = lodash.camelCase(temp);
      $scope.kebab = lodash.kebabCase(temp);
      $scope.snake = lodash.snakeCase(temp);
    });
  };
  </code></pre>
  
  <p>I tried clearing the $scopes inside of the function but it looks like after the first ng-click, the function isn't even been called. Does having embedded directives affect ng-clicks?</p>
  
  <p>Any help with this? I don't want to click "clear" every time I want to generate words, I want them to be able to click generate and get random words every time.</p>
  
  <p>Thank you in advance!</p>
  
  <p>UPDATE: Here is a plnkr of the problem: <a href="http://plnkr.co/edit/qGB1VjsIJgBzWKl8tXMt?p=preview" rel="nofollow">http://plnkr.co/edit/qGB1VjsIJgBzWKl8tXMt?p=preview</a></p>