简体   繁体   中英

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);
                            }
                        );

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM