<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-ngChange-directive-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
</head>
<body ng-app="changeExample">
<script>
angular.module('changeExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.selects = [
{name: "1"},
{name: "2"}
];
$scope.counter = 0;
$scope.change = function() {
$scope.counter++;
};
$scope.sendMessage = function() {
$scope.message = "Message sent";
}
$scope.confirmed = true;
$scope.mySelectBox = $scope.selects[1];
}]);
</script>
<div ng-controller="ExampleController">
<select ng-model="mySelectBox"
ng-options="item.name for item in selects track by item.name"
ng-change="sendMessage()">
</select>
<input type="checkbox" ng-model="confirmed" ng-change="change()" id="ng-change-example1" />
<input type="checkbox" ng-model="confirmed" id="ng-change-example2" />
<label for="ng-change-example2">Confirmed</label><br />
<tt>debug = {{confirmed}}</tt><br/>
<tt>counter = {{counter}}</tt><br/>
<tt>message = {{message}}</tt><br/>
</div>
</body>
</html>
var counter = element(by.binding('counter'));
var debug = element(by.binding('confirmed'));
it('should evaluate the expression if changing from view', function() {
expect(counter.getText()).toContain('0');
element(by.id('ng-change-example1')).click();
expect(counter.getText()).toContain('1');
expect(debug.getText()).toContain('true');
});
it('should not evaluate the expression if changing from model', function() {
element(by.id('ng-change-example2')).click();
expect(counter.getText()).toContain('0');
expect(debug.getText()).toContain('true');
});