Just do:

    ng-click=&quot;prefs = false&quot;

While @tymeJV gave a correct answer, the way to do this to be inline with angular would be:

`ng-click=&quot;hidePrefs()&quot;`

and then in your controller:

    $scope.hidePrefs = function() {  
      $scope.prefs = false;
    }

You can use some thing like this          

    

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-html --&gt;

    &lt;!DOCTYPE html&gt;
    &lt;html&gt;

    &lt;head&gt;
      &lt;script src=&quot;http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js&quot;&gt;&lt;/script&gt;
    &lt;/head&gt;

    &lt;body&gt;
      &lt;div ng-app=&quot;&quot; ng-init=&quot;btn1=false&quot; ng-init=&quot;btn2=false&quot;&gt;
        &lt;p&gt;
          &lt;input type=&quot;submit&quot; ng-disabled=&quot;btn1||btn2&quot; ng-click=&quot;btn1=true&quot; ng-model=&quot;btn1&quot; /&gt;
        &lt;/p&gt;
        &lt;p&gt;
          &lt;button ng-disabled=&quot;btn1||btn2&quot; ng-model=&quot;btn2&quot; ng-click=&quot;btn2=true&quot;&gt;Click Me!&lt;/button&gt;
        &lt;/p&gt;
      &lt;/div&gt;
    &lt;/body&gt;

    &lt;/html&gt;

&lt;!-- end snippet --&gt;

 


If you are using latest versions of Angular (2/5/6) :

In your component.ts
   

    //x.component.ts
    prefs = false;

    hidePrefs(){
       this.prefs = true;
    }


I have a git repository which holds a Drupal site.  I spent the last day trying to build a feature using several different modules.  I have given up on my current approach and have decided to try a different combination of modules.  However, my repository has several commits on the master branch that contain this feature development process (I understand that I did not branch in an effective manner.)  I want to get rid of the last three or four commits and set master to that point in my history (I don&#39;t want to merge my current work with anything, I just want it to go away.)  How do I do this?




How do I move master back several commits in git?

If I catch a `KeyError`, how can I tell what lookup failed?

    def poijson2xml(location_node, POI_JSON):
      try:
        man_json = POI_JSON[&quot;FastestMan&quot;]
        woman_json = POI_JSON[&quot;FastestWoman&quot;]
      except KeyError:
        # How can I tell what key (&quot;FastestMan&quot; or &quot;FastestWoman&quot;) caused the error?
        LogErrorMessage (&quot;POIJSON2XML&quot;, &quot;Can&#39;t find mandatory key in JSON&quot;)



Which key failed in Python KeyError?

I have a modal that uses ng-show=&quot;prefs&quot; to determine visibility.

My desire is to use the close button in the modal to set $scope.prefs to false and to use an anchor tag to set the value to true. However, all I can find on google uses a checkbox rather than anchor tags.

Is there a way to use ng-click to set a variable to false?

AngularJS: Can&#39;t I set a variable value on ng-click?

I have a modal that uses ng-show="prefs" to determine visibility.
My desire is to use the close button in the modal to set $scope.prefs to false and to use an anchor tag to set the value to true. However, all I can find on google uses a checkbox rather than anchor tags.
Is there a way to use ng-click to set a variable to false?

I wanted to use the MEAN JavaScript Stack, but I noticed that there are two different stacks with either their own website and installation methods: mean.js and mean.io. So I came up asking myself this question: &quot;Which one do I use?&quot;.

So in order to answer this question I ask the community if you could explain what are the differences between these two? And if possible pros and cons? Because they look very similar to me.

Difference between MEAN.js and MEAN.io

I&#39;m working in a small team, building in AngularJS and trying to maintain some basic standards &amp; best practices; especially given we&#39;re relatively new with Angular.

My question is with regards to Directives. More accurately, the `restrict` options.

Some of us are using `restrict: &#39;E&#39;` thus having `&lt;my-directive&gt;&lt;/my-directive&gt;` in the html.

Others are using `restrict: &#39;A&#39;` and having `&lt;div my-directive&gt;&lt;/div&gt;` in the html.

Then, of course, you can use `restrict: &#39;EA&#39;` and use either of the above. 

At the moment it&#39;s no big deal, though when this project is as big as it&#39;s going to get I would like anybody looking at it to easily understand what&#39;s going on.

Are there pros/cons to either the attribute or element way of doing things? 

Are there any pitfalls we should know, if choosing say element over attribute?



AngularJS Directive Restrict A vs E

Please go through the code first


app.js
 
    var app = angular.module(&#39;Nimbus&#39;, [&#39;ngRoute&#39;]);


route.js

    app.config(function($routeProvider) {
        $routeProvider
        .when(&#39;/login&#39;, {
            controller: &#39;LoginController&#39;,
            templateUrl: &#39;templates/pages/login.html&#39;,
            title: &#39;Login&#39;
        })
        .when(&#39;/home&#39;, {
            controller: &#39;HomeController&#39;,
            templateUrl: &#39;templates/pages/home.html&#39;,
            title: &#39;Dashboard&#39;
        })
        .when(&#39;/stats&#39;, {
            controller: &#39;StatsController&#39;,
            templateUrl: &#39;templates/pages/stats.html&#39;,
            title: &#39;Stats&#39;
        })
    }).run( function($q, $rootScope, $location, $route, Auth) {
        $rootScope.$on( &quot;$routeChangeStart&quot;, function(event, next, current) {
            console.log(&quot;Started&quot;);
            
            
            /* this line not working */
            var canceler = $q.defer();
            canceler.resolve();
            
        });
        
        $rootScope.$on(&quot;$routeChangeSuccess&quot;, function(currentRoute, previousRoute){
            $rootScope.title = ($route.current.title) ? $route.current.title : &#39;Welcome&#39;;
        });
     })


home-controller.js
 

    app.controller(&#39;HomeController&#39;,
        function HomeController($scope, API) {
            API.all(function(response){
                console.log(response);
            })
        }
    )

stats-controller.js
 

    app.controller(&#39;StatsController&#39;,
        function StatsController($scope, API) {
            API.all(function(response){
                console.log(response);
            })
        }
    )

api.js

    app.factory(&#39;API&#39;, [&#39;$q&#39;,&#39;$http&#39;, function($q, $http) {    
        return {
            all: function(callback) {
                var canceler = $q.defer();
                var apiurl = &#39;some_url&#39;
                $http.get(apiurl,{timeout: canceler.promise}).success(callback);
            }
        }
    }]);


When I move from home to stats , again API will send http request, I have many http calls like this, I pasted only few lines of code.

What I need is I need to &lt;strike&gt;cancel&lt;/strike&gt; abort all pending http requests on routechangestart or success


Or any other way to implement the same ?

AngularJS abort all pending $http requests on route change

Imagine the situation in AngularJS where you want to create a directive that needs to respond to a global event. In this case, let&#39;s say, the window resize event.

What is the best approach for this? The way I see it, we have two options:
1. Let every directive bind to the event and do it&#39;s magic on the current element
2. Create a global event listener that does a DOM selector to get each element on which the logic should be applied.

Option 1 has the advantage that you already have access to the element on which you want to do some operations. But...options 2 has the advantage that you do not have to bind multiple times (for each directive) on the same event which can be a performance benefit.

Let&#39;s illustrate both options:

**Option 1:**

    angular.module(&#39;app&#39;).directive(&#39;myDirective&#39;, function(){
    
         function doSomethingFancy(el){
             // In here we have our operations on the element
        }
    
        return {
            link: function(scope, element){
                 // Bind to the window resize event for each directive instance.
                 angular.element(window).on(&#39;resize&#39;, function(){
                      doSomethingFancy(element);
                 });
            }
        };
    });

**Option 2:**

    angular.module(&#39;app&#39;).directive(&#39;myDirective&#39;, function(){
    
        function doSomethingFancy(){
             var elements = document.querySelectorAll(&#39;[my-directive]&#39;);
             angular.forEach(elements, function(el){
                 // In here we have our operations on the element
             });
        }
    
        return {
            link: function(scope, element){
                 // Maybe we have to do something in here, maybe not.
            }
        };
    
        // Bind to the window resize event only once.
        angular.element(window).on(&#39;resize&#39;, doSomethingFancy);
    });

Both approaches are working fine but I feel that option two is not really &#39;Angular-ish&#39;. 

Any ideas?

AngularJS : What is the best way to bind to a global event in a directive

How do I enable/disable anchor tags using the directive approach? 

Example: 

 1. while clicking on edit link, create &amp; delete needs to be disabled or grayed out
 2. while clicking on create link, edit &amp; delete needs to be disabled or grayed out

**JAVASCRIPT:**

        angular.module(&#39;ngApp&#39;, []).controller(&#39;ngCtrl&#39;,[&#39;$scope&#39;, function($scope){

        $scope.create = function(){
          console.log(&quot;inside create&quot;);
        };

        $scope.edit = function(){
          console.log(&quot;inside edit&quot;);
        };

        $scope.delete = function(){
        console.log(&quot;inside delete&quot;);
        };

        }]).directive(&#39;a&#39;, function() {
           return {
                restrict: &#39;E&#39;,
                link: function(scope, elem, attrs) {
                    if(attrs.ngClick || attrs.href === &#39;&#39; || attrs.href === &#39;#&#39;){
                        elem.on(&#39;click&#39;, function(e){
                            e.preventDefault();
                            if(attrs.ngClick){
                                scope.$eval(attrs.ngClick);
                            }
                        });
                    }
                }
           };
        }); 

[LINK to CODE][1]


  [1]: http://plnkr.co/edit/jQSnMfwVo8myeTwUciNU?p=preview

Content Type	Original Author	Original Content on Stackoverflow
Question	jgravois	View Question on Stackoverflow
Solution 1 - Angularjs	tymeJV	View Answer on Stackoverflow
Solution 2 - Angularjs	msarchet	View Answer on Stackoverflow
Solution 3 - Angularjs	Bhawna Malhotra	View Answer on Stackoverflow
Solution 4 - Angularjs	user4148098	View Answer on Stackoverflow

AngularJS: Can't I set a variable value on ng-click?

Angularjs Problem Overview

Angularjs Solutions

Solution 1 - Angularjs

Solution 2 - Angularjs

Solution 3 - Angularjs

Solution 4 - Angularjs

Which key failed in Python KeyError?

How do I move master back several commits in git?

Attributions