Skip to content

Throws error if used in a directive #49

Description

@360disrupt

I'm asking this, because I think it is worth to find an example in the docs explaining how to include the directive in own directives.

When including the directive into my own directive I have the following problem:
The $error property is required if the input field is left blank in the main app. In my directive the $error property has no requiredproperty. I can display error message still, because the has-error class is added but I think it is better to work with ng-if.

Main File (HTML)

<form name="myDataForm" ng-submit="save()">
<myDirective form="myDataForm" model="myModel" itemname="someName" error-msg="abc"></myDirective>
</form>

Directive (Coffee)

angular.module 'tsd.myDirective', ['ui.bootstrap.showErrors', 'tsd.fatSearch', 'myManageSomesService']
  .directive 'myDirective', ($http, $rootScope, manageSomesService) ->
    return {
      restrict: 'E'
      replace: true
      scope:
        form: '='
        model: '='
        size: '@'
        itemname: '@'
        label: '@'
      templateUrl: 'directives/autocomplete-some/autocomplete-some.html'
      controller: 'AutocompleteSomeCtrl'
    }

Directive (HTML)

  <div class="form-group search-field" ng-class="size" show-errors>
    <label>{{label}}</label>
    <input type="text" class="form-control" name="{{itemname}}" ng-model="model" required placeholder="{{label}}" id="searchInput" ng-keydown="checkKeyDown($event)" ng-change="search()" required/>
  <p class="help-block" ng-if="form[itemname][$error]">{{errorMsg}}</p>
...

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions