0

I was very happy coding my directive, but I needed an observer on an attribute that had to fire only if the previous value was "x". The problem is, that $observe doesn´t seem to provide the previous value, as $watch does.

Is there a fast way to access an attribute previous value, or do I have to store it for checks?

HTML:

<searcher ng-datasource = 'countries' ng-model = 'chosenCountry' placeholder = 'Search Country' ng-alias = 'country' ng-tuples = 'country as country.name' ng-rows-by-page = 2>

JS

app.directive("searcher", function($datasources, $document){
    return {
        restrict: 'E',
        require: '?ngModel',
        scope: {
            ngModel: '='
        }, 
        replace:true,
        template:
            "<md-select ng-attr-active = '{{hasFocus}}' ng-attr-empty = '{{!searchText}}'>"+
            "   <md-input ng-click = 'handleClick();'>"+
            "       <a class = 'fa fa-search icon' ng-if = '!searchPromise'></a>"+
            "       <a class = 'fa fa-spin icon' ng-if = 'searchPromise'>&#8987;</a>"+
            "       <input type = 'text' ng-model = 'searchText' ng-keydown = 'handleKeydown()' ng-focus='handleFocus()'>"+
            "   </md-input>"+
            "   <ul>"+
            "       <li ng-repeat = 'row in __rows track by $index' ng-click = 'choose(row)'>{{txt(row)}}</li>"+
            "   </ul>"+
            "</md-select>"+
        "",
        link: function( scope, element, attrs, ctrl ) {

....
attrs.$observe("active", function(newValue){
                if ( newValue == "false" ){
                    ctrl.$setTouched();
                }
            });
...

Ignored the rest of the code, as irrelevant for my question. If you want a complete, working example: http://codepen.io/sergio0983/pen/XKEQqg?editors=1010

Note that in the working example you might find slightly different code (I used the focus function to store the attribute after the first interaction) that is already working. I only want to know if I can access the previous value of the attribute in $observe somehow.

sergio0983
  • 1,232
  • 8
  • 15
  • `var original = attrs.attributeName`? – charlietfl Jul 22 '16 at 13:20
  • Well, that very much looks like the "store it for checks", and besides, I tried it in the link function, and didn´t store it properly (got undefined) so I had to store it in the function that altered the attribute. – sergio0983 Jul 22 '16 at 15:49
  • Provide [mcve] demo – charlietfl Jul 22 '16 at 15:51
  • Not sure that it´s really needed, I don´t want a piece of code that solves my issue, only want to know if there is a built in function or property in angular that makes what I want, but I will post the example if you think it may help. Will take 2 minutes. – sergio0983 Jul 22 '16 at 15:56
  • well maybe you need to be using isolated scope...we have no idea without seeing some code – charlietfl Jul 22 '16 at 15:58
  • Took more than 2 minutes, but it´s done, thanks for your patience :) – sergio0983 Jul 22 '16 at 16:09

1 Answers1

0
$scope.$watch('someAttr',function(newValue,oldValue){
   if(oldValue === 'x'){
     // do something
   }
});
krutkowski86
  • 1,084
  • 9
  • 16
  • I´m a newbie in angular, but if I´m not wrong, $scope.$watch is used for variables in scope, and attrs.$observe for attributes in the DOM node, that is what I need, hence the question. Using $scope.$watch will always return "undefined" if you put an attribute. Not 100% sure, just correct me if I´m wrong – sergio0983 Jul 22 '16 at 15:46
  • Exactly my case, it was an interpolated attribute; thank you for the information. – sergio0983 Jul 22 '16 at 16:00