AngularJS，选择onChange或ngChange

我是新的使用angularjs和角度用户界面。我对标签感兴趣。AngularJS，选择onChange或ngChange

这是我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.

来源

2013-04-22 yozawiratama

有了Angular，我们通常不会寻找事件来触发更改。相反，当模型更改时，视图应更新以反映这些更改。

在这种情况下，应根据模型中的值启用第二个元素（未禁用）。当连接到第一个选择菜单的模型值满足某些条件时，启用第二个菜单。是的，从技术上说有一个事件，但我们不需要关心它，所有重要的事情都是模型的价值。

这里有一个如何这可能工作一个简单的例子：

<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

来源

2014-01-03 04:29:22 joemaller

好吧，如果我仍然需要在选择执行的功能？那又怎么样？ – sorin7486 2014-06-24 17:33:33

@ sorin7486如何在$ watch上选择更新的变量？ – Amicable 2015-02-04 10:52:37

是的，这将工作，但我想用这个验证，所以我试图保持在模板中的东西 – sorin7486 2015-02-05 13:42:12

angular-js select支持ng-change属性，它可以调用在范围中定义的任何javascript方法。例如：

然而，你最好的选择可能只是评估你的ng-disabled =属性中的$ scope表达式，例如， ng-disabled =“params.id =='X'”。

来源

2013-05-31 15:47:41

AngularJS，选择onChange或ngChange

回答

相关问题