AngularJS : ng-change not working when i input.val() with jquery

Question

I'm using AngularJS and jQuery for a project. When i typing input, ng-change is working.. But, when i using jquery input.val('blabla') ng-change is not working.. How can i report this change angularjs side? This is my code.. Apply or watch or other one?

 // Html
    <input type="text" name="city" class="city-input req-string" rel="cityCtr" value="" ng-model="city" ng-change="findWeather(city)">

    // jQuery code
    $('.city-input').val('İstanbul');

     // All AngularJS code
    var app = angular.module('weatherApp', []);

app.controller('weatherCtrl', ['$scope', 'weatherService', function($scope, weatherService) {

    function fetchWeather(city) {
        weatherService.getWeather(city).then(function(data){
            $scope.items = data;
        });
    }

    $scope.findWeather = function(city) {
        $scope.items = '';
        fetchWeather(city);
        alert(city);
    };

}]);

app.factory('weatherService', ['$http', '$q', function ($http, $q){
    function getWeather (city) {
        var deferred = $q.defer();
        var query = 'select * from weather.forecast where woeid in (select woeid from geo.places(1) where text="'+city+'")',
            url   = "http://query.yahooapis.com/v1/public/yql?q=" + query + "&format=json&callback=";
        $http.get(url)
            .success(function(data){
                deferred.resolve(data.query.results.channel.item.forecast);
                console.log(data)
            })
            .error(function(err){
                console.log('Error retrieving markets');
                deferred.reject(err);
            });
        return deferred.promise;
    }

    return {
        getWeather: getWeather
    };
}]);

You probably just need to force a digest cycle with $scope.$apply or $timeout. — Shomz
– Shomz, Commented Feb 7, 2015 at 10:34
Where should i use $scope.$apply or timeout? in findWeather function? — kenanyildiz90
– kenanyildiz90, Commented Feb 7, 2015 at 10:39
possible duplicate of AngularJS ng-model binding not updating with dynamic values — Sunny Sharma
– Sunny Sharma, Commented Feb 7, 2015 at 10:45
another Possible duplicate: stackoverflow.com/questions/22612650/… — Sunny Sharma
– Sunny Sharma, Commented Feb 7, 2015 at 10:46

Wekerle Tibor · Accepted Answer · 2018-05-24 11:11:45Z

2

Just use:

$('.city-input').val('İstanbul').trigger('input');

Instead of:

$('.city-input').val('İstanbul');

answered May 24, 2018 at 11:11

Wekerle Tibor

4772 gold badges7 silver badges19 bronze badges

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

Collectives™ on Stack Overflow

AngularJS : ng-change not working when i input.val() with jquery

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related