adding event listener with angularjs

Question

So I would like to know when one of my variable changes in the html side. But I couldn't find any way to use event listener ($watch) on my angular controller.

So, here is the problem that I am trying to fix:

 <div class="form-group">
                    <label class="col-md-3 control-label">Please Select the Device</label>
                    <div class="col-md-9">
                        <select class="form-control" ng-model="reportCtrl.selectedDevice" ng-options="item.name as item.MyName for item in reportCtrl.deviceList">
                        </select>
                    </div>
                </div>

                <div class="form-group" ng-if="reportCtrl.selectedDevice">
                    <label class="col-md-3 control-label">Please Select the Sensor</label>
                    <div class="col-md-9">
                        <select class="form-control">
                        </select>
                    </div>
                </div>

I fill the options with device list, depending on what user selects, I need to make another call to get all the sensor properties within that device, but I would like to make the call whenever user picks the device.

So how can I use event listener in this case to make my call??

HankScorpio · Accepted Answer · 2016-02-17 00:37:19Z

2

Simply use ng-change as the trigger for making the call. When you get your response, your 2nd select will update its options automatically (after you add in the ng-options attribute, of course).

<select class="form-control" ng-change="doTheThing()" ng-model="reportCtrl.selectedDevice" ng-options="item.name as item.MyName for item in reportCtrl.deviceList">

You could alternatively use a $watch, but it's less efficient than ng-change in this case. $scope.$watch('reportCtrl.selectedDevice', function(newValue, oldValue){...});

answered Feb 17, 2016 at 0:37

HankScorpio

3,65117 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

adding event listener with angularjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related