angularjs two directives on one element

Question

I have two directives: ``` // Generated by CoffeeScript 1.6.3 app.directive("focusMe", function() { return { scope: { focus: "=focusMe" }, link: function(scope, element) { return scope.$watch("focus", function(value) { if (value === true) { element[0].focus(); return scope.focus = false; } }); } }; }); ``` and: ``` // Generated by CoffeeScript 1.6.3 app.directive("cleanMe", function() { return { scope: { clean: "=cleanMe" }, link: function(scope, element) { return scope.$watch("clean", function(value) { if (value === true) { element[0].value = ""; return scope.clean = false; } }); } }; }); ``` and this input (angularUI): ``` <input type="text" ng-model="addUserSelected" typeahead="emp.value for emp in allUsers | filter:$viewValue | limitTo:5" typeahead-editable="false" typeahead-on-select="addLine($item.id)" focus-me="usersFocusInput" clean-me="usersCleanInput"> ``` I get this error: ``` Error: [$compile:multidir] http://errors.angularjs.org/1.2.3/$compile/multidir?p0=cleanMe&p1=focus…

Accepted Answer

I found the solution finally :)

```
// Generated by CoffeeScript 1.6.3
app.directive("focusMe", function() {
  return {
    link: function(scope, element, attributes) {
      return scope.$watch(attributes.focusMe, function(value) {
        if (scope[value] === true) {
          element[0].focus();
          return scope[attributes.focusMe] = false;
        }
      });
    }
  };
});

// Generated by CoffeeScript 1.6.3
app.directive("cleanMe", function() {
  return {
    link: function(scope, element, attributes) {
      return scope.$watch(attributes.cleanMe, function(value) {
        if (value === true) {
          element[0].value = "";
          return scope[attributes.cleanMe] = false;
        }
      });
    }
  };
});
```

In the html usersFocusInput and usersCleanInput are parameters in the scope that is wht I use scope[attributes.focusMe] to get this parameter and change him to false.

```
<input type="text" ng-model="addUserSelected" typeahead="emp.value for emp in allUsers | filter:$viewValue | limitTo:5" typeahead-editable="false" typeahead-on-select="addLine($item.id)" focus-me="usersFocusInput" clean-me="usersCleanInput">
```

angularjs two directives on one element

Solution

Problem

Related problems