ng-click function in angularjs factory -

i change variable in angularjs (1.x) factory click event. after pause button should appear. please me:

the link ng-click:

<li ng-click='navplaymusic()'>   <a class="glyphicon glyphicon-play music-control"></a> </li> <li ng-show="musiccontrol.playtitle === true" ng-click='navpausemusic()'>   <a class="glyphicon glyphicon-pause music-control"></a> </li> 

edit:

the controller:

music.controller('musiccontroller', function($scope, $rootscope, $location, musiccontrol) {   ...   $scope.musiccontrol = musiccontrol;   $scope.navplaymusic = function() {      musiccontrol.playmusic();   }   ... }); 

the factory:

music.factory('musiccontrol', function () { return {   playtitle: false, }; this.playmusic = function() {   return {     playtitle: true   };  }; }); 

you can try this

factory:

    music.factory('musiccontrol', function() {         var _flags = {  //note: intentionally declare properties here easy track how many flag have in factory (optional)             playtitle: false          }         return {             flags: _flags,             playmusic: playmusic         };          function playmusic(dummyparam) {             //handle play music logic             //dummyparam 5 if called html.              //after done, enable flag             _flags.playtitle = true;         };     }); 

controller:

    music.controller('musiccontroller', function($scope, $rootscope, $location, musiccontrol) {          //...          $scope.musicflags = musiccontrol.flags;   //map property need use. more make code hard understand         $scope.navplaymusic = musiccontrol.playmusic; //just need map function          //...      }); 

html:

    <li ng-click='navplaymusic()'>         <a class="glyphicon glyphicon-play music-control"></a>     </li>     <li ng-show="musicflags.playtitle === true" ng-click='navpausemusic(5)'>         <a class="glyphicon glyphicon-pause music-control"></a>     </li>