Угловая радио кнопка не стреляет на часы

Question

У меня есть часы на region, но он не стреляет, когда я нажимаю на переключатель.

Я делаю что-то неправильно или это потому, что радиокнопки обнаруживают изменение только раз в угловом? Во всяком случае вокруг этого без использования формы?

<div class="filter-column"> 
    <div class="filter-title">Region</div> 
    <div class="bottom-line"></div> 
    <div class="overflow-container"> 
     <div ng-repeat="choice in regions| orderBy: 'description'"> 
     <input type="radio" 
      value="{{choice.name}}" 
      name="regionRadio" 
      ng-model="region"> 
     {{choice.description}} 
     </div> 
    </div> 
    </div> 

---

$scope.$watchCollection(watchRMDapisPopulate, 
    populateRMDfiltersView); 

    function watchRMDapisPopulate() { 
     return regionMarketDealerSrv.orgFilterData; 
     } 

     function populateRMDfiltersView(newValue, oldValue) { 
     if (newValue) { 
      $scope.regions = newValue.regions; 
     } 
     } 



     $scope.$watch('region', radioButtonRegion); 

     function radioButtonRegion(regionName) { 
     console.log(regionName) 
     if (regionName === 'All') { 
      regionMarketDealerSrv.populateRegions(); 
     } else { 
      regionMarketDealerSrv.populateMarkets(regionName); 
     } 
     } 

Answer 1

Часы не в состоянии подобрать изменения правильно при использовании ng-model="region", так как вы используете примитивные значения. Когда вы меняете значение, вы получаете новую ссылку. Вы можете использовать свойство объекта в качестве модели и $watch, что:

var app = angular.module('app', []) 
 

 
app.controller('MyController', function($scope) { 
 
    $scope.regions = [{ 
 
    name: 'a', 
 
    description: 'region A' 
 
    }, { 
 
    name: 'b', 
 
    description: 'region B' 
 
    }]; 
 

 
    $scope.selected = { 
 
    region: 'a' 
 
    }; 
 

 
    $scope.$watch('selected.region', radioButtonRegion); 
 

 
    function radioButtonRegion(newVal, oldVal) { 
 
    if (newVal !== oldVal) { 
 
     console.log(newVal, oldVal) 
 
    } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="MyController"> 
 
    <div>Region</div> 
 
    <div ng-repeat="choice in regions| orderBy: 'description'"> 
 
    <input type="radio" value="{{choice.name}}" name="regionRadio" ng-model="selected.region">{{choice.description}} 
 
    </div> 
 
</div>