एंगुलरजेएस, चेंज या एनजी चेंज

Question

का चयन करें मैं angularjs और कोणीय यूजर इंटरफेस का उपयोग कर नया हूं। मुझे टैग में रूचि है।

यह मेरा html:

<select id="part1" ui-select2 ng-model="params.id" style="width: 200px;"> 
    <option value="">Provinsi</option> 
    <option ng-repeat="v in prov" value="{{v.id}}" title="{{v.text}}" 
    ng-selected="v.id == params.id">{{v.text}}</option> 
</select> 
<select id="part2" ui-select2 ng-model="params2.id" style="width: 200px;" ng-disabled="true"> 
    <option value="">Kabupaten</option> 
    <option ng-repeat="y in kab" value="{{y.id}}" title="{{y.text}}" 
    ng-selected="y.id == params.id">{{y.text}}</option> 
</select> 

और यह मेरा app.js:

$http.get('json/provinsiData.json').success(function(datax) { 
    $scope.prov = datax; 
}); 

//part2 data 
$http.get('json/acehData.json').success(function(datay) { 
    $scope.kab = datay; 
}); 

$scope.params = {} 
$scope.params2 = {} 

आप देख सकते हैं select part2 अक्षम है।

मैं एक ईवेंट परिवर्तन कैसे बना सकता हूं जो नीचे की स्थिति की तरह काम करता है?

if selected option of part1 is index 0 
then select part2 disabled = false and load json part2 data. 

Answer 1

कोणीय के साथ, हम आमतौर पर परिवर्तनों को ट्रिगर करने के लिए ईवेंट की तलाश नहीं कर रहे हैं। इसके बजाए, जब मॉडल बदलता है, तो दृश्य को उन परिवर्तनों को दर्शाने के लिए अद्यतन करना चाहिए।

इस मामले में, मॉडल में किसी मान के आधार पर दूसरा तत्व सक्षम होना चाहिए (अक्षम नहीं)। जब पहले चयन मेनू से जुड़े मॉडल मान कुछ शर्त को पूरा करते हैं, तो दूसरा मेनू सक्षम करें। हां, तकनीकी रूप से एक घटना है, लेकिन हमें इसकी परवाह करने की आवश्यकता नहीं है, जो सभी महत्वपूर्ण हैं मॉडल के मूल्य हैं।

यह इस तरह काम कर सकते हैं की एक सरल उदाहरण है:

<select ng-model="selection.item"> 
    <option value="">Clothing</option> 
    <option ng-repeat="item in clothes">{{ item }}</option> 
</select> 

<select ng-model="selection.size" ng-disabled="!selection.item"> 
    <option value="">Size</option> 
    <option ng-repeat="size in sizes">{{ size }}</option> 
</select> 

दूसरा चयन मेनू के ng-disabled विशेषता एक सरल अभिव्यक्ति जो मूल रूप से का आकलन करती है "मुझे अक्षम करें यदि selection.item एक मूल्य नहीं है"। यह आसानी से एक अधिक जटिल अभिव्यक्ति या एक समारोह हो सकता है।

यहाँ a plunkr based on the code above

Answer 2

कोणीय-जेएस एनजी-चेंज विशेषता का समर्थन करता है जो किसी भी जावास्क्रिप्ट विधि को दायरे में परिभाषित कर सकता है। उदाहरण:

हालांकि आपकी सर्वश्रेष्ठ शर्त केवल आपके एनजी-अक्षम = विशेषता में $ स्कोप अभिव्यक्ति का मूल्यांकन करने के लिए हो सकती है, उदा। ng-disabled = "params.id == 'X'"।