rendering a dynamic placeholder with angular

Question

I\'ve looked around, found several resources labeled \'ng-placeholder\' or something incredibly similar. I cannot get this to work:

Answer 1

There exists a conditional attribute property in AngularJS ng-attr-{property_name}

For example, I'm using different placeholders for different search terms using

 ng-attr-placeholder="{{isAdvanceSearch ? setPlaceholder(searchOption) : 'John Smith, 08/23/1970, 123'}}"

Here on the basis of isAdvanceSearch variable, I'm setting different placeholders in setPlaceholder method.

setPlaceholder method returns the placeholder to set in the input field.

$scope.setPlaceholder = function(searchOption) {
     if (searchOption === "foo") {
          return "Search by foo… e.g. foo1";
     } else if (searchOption === "bar") {
          return "Search by bar… e.g. bar123";
     } else {
          return "John Smith, 08/23/1970, 123";
     }
};

Note: John Smith, 08/23/1970, 123 is the default placeholder. Don't forget to wrap the expression in the {{}} brackets.