Changing value of a select triggers an event on another select in Angularjs -

I'm new to angular. I wonder if this can be done. I have the elements to choose from for a province and for a city when the province changes, then I want to select the city. I have written that there are instructions for bringing data from the server using angular services. But I do not know when people change the province, where the province changes, I really want to know that I can trigger an incident on city directions when there is a change in the province's direction. I went to it but found no solution. Any help is appreciated in advance, here are my instructions:

province director

  'strict use'; App.directive ('province', function (province, $ rootscope) {return {restrict: 'E', replace: true, templateUrl: "/Templates/Directives/province.html", link: function (scope, element, attr) ), Controller) {var elm = angular.element (element); Elm.attr ('id', attr ['id']); Elm.attr ('name', attr ['name']); Elm.attr ('class', etr ['class']); LM.ETR ('ng-model', atr ['ng-model']), province.gate (). Then (function (provincial) {scope.provins = province;});}};})  

city directory

  'Strict experiment'; App.directive ('city', function (city, $ rootscope) {return {restrict: 'E', replace: true, templateUrl: '/ Templates / Directives / city.html', link: function (scope, element, attr) ), Controller) {var elm = angular.element (element); Elm.attr ('id', attr ['id']); Elm.attr ('name', attr ['name']); Elm.attr ('square', etr ['square']); LM.ETR ('ng-model', atr ['ng-model']); City. GTProvis (8). Then (function (city) {scope.cities = city}}}}}}}}  

And this is my template:

Province.html

  & lt; Select & gt; & Lt; Option ng-repeat = "province in provinces" value = "{{province.provinceId}}" & gt; {{Province.provinceName}} & lt; / Options & gt; & Lt; / Select & gt;  

city.html

& lt; Select & gt; & Lt; Option ng-repeat = "city in cities" value = "{{city.cityId}}"> gt; {{City.cityName}} & lt; / Options & gt; & Lt; / Select & gt;

Read about how to implement the first ng-options. Also add ng-change in your province and your code will change on:

  & lt; Select data-ng-model = "selected" data-ng-option = "province.provinceId province.provinceName for provinces province selected as" data-ng-change = "provinceChanged ()" & gt; & Lt; / Select & gt;  

Then a fire in a province from your link function for your province's instruction takes place when the changing ng change occurs:

  scope.selectedProvince = False; Scope Project Change = Function () {if (! Scope.selectedProvince) {Return; } $ Root scope. $ Broadcast (provide "province changed", {province: region selected)); };  

And listen to that incident in your city's directions:

  scope $ ("Province changed", function (event, data) {console log (data.province); // selected province});