CODEWITHSUNDEEP
javascriptjqueryangularjs
Prashobh
Prashobh

Reputation: 9542

How ot give $this in Angular js

I am displaying datas in a grid ,on click of active or inactive button i have to change the button ,functionality is working fine ,for changing icon i am unable to find the active clicked button ,in jquery we can use "this" ,but no idea in angular js ,pls help

 $scope.activeSource = function(datasource,status)
                {

                        $scope.loading = true;
                        $scope.activeInfo = {
                                datasource:datasource,
                        };
                        $scope.alerts = [];
                        if(status == "Stopped")
                        {
                            $scope.entityService.activeInfo($scope.activeInfo,
                            function( msg ) // success
                            {
                                $scope.loading = false;
                                $rootScope.successMsg.push(msg);
                                $('.icon-play').hide();  // this.
                                $('.icon-stop').show();  // this.  no idea

                            },
                            function( msg ) // error
                            {
                                $scope.loading = false;
                                $rootScope.successMsg.push(msg);
                            }
                        );

Upvotes: 0

Views: 422

Answers (1)

Ayush
Ayush

Reputation: 42440

You don't need to use this to access the button. Instead, in your controller create a javascript object that holds all the attributes for the button. Something like this:

$scope.myButton = {
  src : 'foobar.png',
  isVisible : true
};

Then, define your button like this:

<img ng-src="myButton.src" ng-show="myButton.isVisible" />

Now, when you want to modify any attribute of the button, you just need to change the javascript object myButton, and angular will take care of updating the actual button.

For example, if you want to hide the button:

// you don't need to do this
// $('#myButton').hide();

// instead just do this
$scope.myButton.isVisible = false;

Similarly, you can change the src of the image as well.

Upvotes: 3

Related Questions