AngularJS、onChangeまたはngChangeを選択してください

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

Angularでは、通常、変更をトリガーするイベントは探していません。代わりに、モデルが変更されると、ビューはそれらの変更を反映するように更新されます。

この場合、モデルの値に応じて、2番目の要素を有効にする（無効にしない）必要があります。第1の選択メニューに接続されているモデル値が何らかの条件を満たす場合には、第2のメニューを有効にする。はい、技術的にイベントがありますが、気にする必要はありません。重要なのはモデルの値だけです。

はここで、これはうまくいくかもしれない方法の簡単な例です：

<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> 

第2の選択メニューのng-disabled属性は基本的にに評価され、単純な表現である「selection.itemが値を持っていない場合は、私を無効にします」。これは、より複雑な表現や機能と同じように簡単に行うことができます。

はここa plunkr based on the code above

Answer 2

angle-js selectは、scopeに定義されているjavascriptメソッドを呼び出すことができるng-change属性をサポートしています。 例：

ただし、ng-disabled =属性の$ scope式を評価するだけでよい場合があります。 ng-disabled = "params.id == 'X'"