Angularjs: how change icon when item is clicked
<p>I know that this question has already some answers/solutions but none of them works for me most probably because this is the first time when I'm trying to implement something using Angularjs.</p>

<p>I have a <code>div</code> (title) that expands some info when it's clicked and I want to change the icon inside of it when that info is visible...</p>

<p>This is my code:</p>

<pre><code>&lt;div class="title" ng-click="view_variables(request)"&gt;
    &lt;i class="glyphicon glyphicon-chevron-right"&gt;&lt;/i&gt;
&lt;/div&gt;
</code></pre>

<p>And this is what I tried to do, but not working because the div will not show the expanded info anymore:</p>

<pre><code>&lt;div class="title" ng-click="view_variables(request) = !view_variables(request)"&gt;
    &lt;i ng-class="{'glyphicon glyphicon-chevron-right':!view_variables(request), 'glyphicon glyphicon-chevron-left': view_variables(request)}"&gt;&lt;/i&gt;
&lt;/div&gt;
</code></pre>

<p>Controller code:</p>

<pre><code>$scope.view_variables = function(req){
    if (!req.enabled_variables &amp;&amp; !req.disabled_variables) {
        $http.get('/api/files/' + $scope.file_id + '/requests/' + req.id + '/variables')
        .success(function(data){
            variables = data.data;
            req.enabled_variables = [];
            req.disabled_variables = [];
            for (i=0; i&lt;variables.length; i++) {
                if (variables[i].disabled == true) {
                    req.disabled_variables.push(variables[i]);
                } else {
                    req.enabled_variables.push(variables[i])
                }
            }
        });
    }

    req.show_variables = !req.show_variables;
}
</code></pre>