Angularjs - Changing view with json return

Question

Angularjs - Changing view with json return

Navigation

#1 by (0 votes)

0

My application checks the state of a lamp and creates an animation in the view.

I am making an ajax request with angular and on the return of success I have to animate a light bulb by following the code:

$scope.checkLuzOk = function (response) {
    (response.data.luzSala === '1') ? aninOn($scope.luzSala) : $scope.aninOff($scope.luzSala);
}

I have a luzSala in the file html for animation and I'm using $scope.luzSala as a parameter in the functions aninOn() and aninOff() , it follows animation excerpt:

var aninOn = function (luz) {
        var images = [
            "light0.png",
            "light10.png",
            "light20.png",
            "light30.png",
            "light40.png",
            "light50.png",
            "light60.png",
            "light70.png",
            "light80.png",
            "light90.png",
            "light100.png"
        ];

        var i = 0;
        $interval(function () {
            if (i >= images.length) {
                i = 0;
            }
            luz = images[i];
            i++;
        }, 50, 11);
    };

The problem is that the image is not being altered when I step s

angularjs json

asked by anonymous 01.02.2017 / 04:38

1 answer

Fill textbox for textbox Fit picture in mobile version

score 0 · Answer 1

I think for a more complete answer we would have to see the HTML of the image, as the image code could include.

The correct way to work with images is to use the ngSrc directive, as shown in the documentation: Wrong:

<img src="http://www.gravatar.com/avatar/{{hash}}"alt="Description"/>

Correct:

<img ng-src="http://www.gravatar.com/avatar/{{hash}}"alt="Description" />

Source: link

In addition, what you can do is include a $ digest () after the image swap:

var i = 0;
$interval(function () {
    if (i >= images.length) {
        i = 0;
    }
    luz = images[i];
    $scope.$digest();
    i++;
}, 50, 11);

Depending on the approach to deploying your binding, you may need to $digest() or $apply() , check the one that best fits your need. See more about $digest() and $apply() at this link:

link