क्या div टैग में ng-disabled काम करता है? यदि नहीं, तो क्यों?

Question

मैंने div टैग में ng-disabled का उपयोग करने का प्रयास किया है, लेकिन यह काम नहीं कर रहा है। क्या एनजी-अक्षम div टैग पर काम करेगा? यदि हां तो कैसे?

<div ng-disabled="true"> 
<button>bbb</button> 
</div> 

Answer 1

"एनजी-अक्षम" तत्व पर "अक्षम" विशेषता को जोड़ता या हटा देता है। हालांकि एक div पर HTML "अक्षम" में कोई प्रभाव नहीं पड़ता है।

तो एक तरह से "एनजी-अक्षम" काम कर रहा है, लेकिन यह एक div पर इसका उपयोग करने के लिए समझ में नहीं आता है।

आप किसी फ़ील्ड में "ng-disabled" जोड़ सकते हैं, हालांकि इसमें इनपुट तत्वों को नेस्टेड अक्षम कर दिया जाएगा। , देख http://nerd.vasilis.nl/disable-html-elements-with-css-only/

Answer 2

वहाँ कि 'अक्षम' विशेषता लेता HTML में तत्वों की एक संख्या है:

एक और वैकल्पिक हल सीएसएस गुण "अस्पष्टता" और "कोई भी सूचक-घटनाओं" का उपयोग करके विकलांग प्रभाव अनुकरण करने के लिए हो सकता है असल में, डीआईवी उनमें से एक नहीं है।

आप देख सकते हैं तत्वों उस गुण ले, here

इन तत्वों

'अक्षम' attr स्वीकार करते हैं:

• बटन
• इनपुट
• चयन
• पाठ क्षेत्र
• optgroup
• विकल्प
• fieldset

Answer 3

'एनजी-विकलांग' के उपयोग, के रूप में कोणीय के देव गाइड कहते हैं, केवल एक इनपुट टैग के लिए है।

<INPUT ng-disabled=""> 
... 
</INPUT> 

Answer 4

तो जो मैं इकट्ठा करता हूं, उससे बटन को धक्का देने पर आप div को अक्षम करने का प्रयास कर रहे हैं? अन्यथा आप इस तरह के बटन को अक्षम कर सकते हैं।

<div> 
<button ng-disabled="true">bbb</button> 
</div> 

लेकिन मुझे समझ में नहीं आता कि क्यों इसे फिर से सक्षम नहीं किया जा सकता है।

Answer 5

आप अगले निर्देश का उपयोग कर सकते हैं:

// ********************************* ** // // यह निर्देश सभी तत्वों के लिए एनजी-अक्षम निर्देश है और न केवल बटन // ************************* ********** //

app.directive('disabledElement', function() { 
    return { 
     restrict: 'A', 
     scope: { 
      disabled: '@' 

     }, 
     link: function (scope, element, attrs) { 

      scope.$parent.$watch(attrs.disabledElement, function (newVal) { 

       if (newVal) 
        $(element).css('pointerEvents', 'none'); 


       else 
        $(element).css('pointerEvents', 'all'); 


      }); 

     } 

    } 
}); 

और html:

<div ng-click="PreviewMobile()" data-disabled-element="toolbar_lock"></div>