title: How to create a directive for disable all elements into div element
body: <p>how to create a directive for disable all elements into div element ?</p>
  
  <p>something like this :</p>
  
  <pre><code>&lt;div div-disabled div-disabled-condition="state=='Stack'||state=='Over'||state=='Flow'"&gt;
    &lt;input type="text"/&gt;
    &lt;input type="url"/&gt;
    &lt;div&gt;
      &lt;input type="text"/&gt;
      &lt;input type="url"/&gt;
    &lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>Is it possible? I have no idea .</p>
  
  <pre><code>     angular
      .module('uiRouterApp.ctrl.add', ['uiRouterApp.ctrl.customDirective'])
      .controller('addCtrl', [
          '$scope',
          '$location',
          '$stateParams',
          '$state',
          function ($scope, $location, $stateParams, $state) {
              $scope.state = {};
           }
      ]).directive('divDisabled', function () {
          return {
          scope: {
                divDisabledCondition: '@'
               },
              link: function (scope, element, attrs) {
  
              }
          };
      });
  </code></pre>
  
  <p><strong>Update :</strong></p>
  
  <p>please see this :</p>
  
  <pre><code>   &lt;div class="col-sm-12 ng-isolate-scope" selected-object="SelectedAutoComplete" local-data="requirements.Item1" search-fields="NameFa,NameEn" title-field="NameFa" minlength="2" field-required="true" image-field="ImageUrl" disable-auto-compelete="response.State=='Success'||response.State=='Error'||response.State=='Warning'"&gt;
  
  &lt;div class="angucomplete-holder"&gt;
    &lt;input id="_value" ng-model="searchStr" type="text" placeholder="select" class="form-control ng-dirty" ng-focus="resetHideResults()" ng-blur="hideResults()" autocapitalize="off" autocorrect="off" autocomplete="off" ng-change="inputChangeHandler(searchStr)" ng-disabled="response.State=='Success'||response.State=='Error'||response.State=='Warning'" style=""&gt; 
  
    &lt;!-- ngIf: showDropdown --&gt;
    &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>directive :</p>
  
  <pre><code>.directive('contentsDisabled', function() {
          return {
              compile: function(tElem, tAttrs) {
                  var inputs = tElem.find('input');
                  for (var i = 0; i &lt; inputs.length; i++) {
                      inputs.attr('ng-disabled', tAttrs['disableAutoCompelete']);
                  }
              }
          }
      })
  </code></pre>
  
  <p>why When the <code>state</code> is 'Success' or 'Error' or 'Warning' Input not disabled ?</p>