Подтвердить что ты не робот

AngularJS, выберите onChange или ngChange

Я использую angularjs и angular пользовательский интерфейс. Меня интересует тег.

Это мой 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.
4b9b3361

Ответ 1

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

Второй атрибут select ng-disabled - это простое выражение, которое в основном оценивает "отключить меня, если selection.item не имеет значения". Это также может быть просто более сложным выражением или функцией.

Здесь plunkr на основе кода выше

Ответ 2

angular -js select поддерживает атрибут ng-change, который может вызывать любой метод javascript, определенный в области видимости. Пример:

Однако лучшим вариантом может быть просто оценка выражения $scope в атрибуте ng-disabled =, например. ng-disabled = "params.id == 'X'".