javascript - How to get dynamic view to update properly when scope variable changes -

i developing angular spa , on 1 view there $scope variable determines majority of content page. if user clicks on different link in menu, parameters passed through url, , scope variable gets updated. however, when doing this, view not updated. don't ask questions on here, have tried seems everything, , can't figure out why view isn't being updated. here code looks like:

html

<div ng-init="loadtopicview()">     <h1 ng-bind="selectedtopic.title"></h1>     <p ng-bind="selectedtopic.body"></p> </div> 

js

$scope.loadtopicview = function() {     var selectedtopic  = urlparams.index;     $scope.selectedtopic = $scope.topics[selectedtopic]; } 

initially, thought because of way being called $scope.selectedtopic wasn't getting correct value, url didn't have value yet. $scope.topics array of objects , ever link user clicks on pass index through url , assign correct object $scope.selectedtopic.

after trying many things, tried running on , on see if make difference using window.setinterval didn't change fact reason html isn't updating.

i've seen issues before, boolean values , ng-show can't figure 1 out. appreciated.

more info requested:

here html side nav selects content showed on page

<ul class="sidebar-nav">     <li ng-repeat="topic in topics">         <a href="" ng-click="loadpage('/topics', topic.id)" ng-bind="topic.title"></a>     </li> </ul> 

here javascript $scope.loadpage

$scope.loadpage = function(path, passedparams) {     // @ point, `path` going /topics view, , `passedparams` has id topic load, lets integer: 5.      if(path === $location.path() && path == '/topics') { // if you're switching topics staying on topic page         if (!passedparams) {             $state.reload(); // meaning refresh page, no topic selected.         } else {             $location.path(path).search({params: passedparams});              $rootscope.$emit("callingtopicupdate", {});         }     } else { // works fine in loading correct topic, when on topic page (so above if), won't load scope changes.         if (passedparams) {             $location.path(path).search({params: passedparams});         } else {             $location.path(path);         }     } }; 

oh , in same controller $scope.loadtopicview

$rootscope.$on("callingtopicupdate", function(){     $scope.loadtopicview(); }); 

using $emit , $on when different topic selected while on topic page, run function again. where, updates $scope.selectedtopic change isn't made manifest in data loaded on screen.

as result, can see params (an integer representing topic), change in url, page view dynamically binding data depending on topic doesn't switch item selected until select topic. in essence, if keep selecting topics, url right, , view 1 topic behind url.

$scope.loadtopicview = function(param) {           var selectedtopic  = param ? param : 1;           $scope.selectedtopic = $scope.topics.filter(function(value){return value.id==selectedtopic; }); }; $scope.loadpage = function(path, passedparams) {               // @ point, `path` going /topics view, , `passedparams` has id topic load, lets integer: 5.               if(path === $location.path() && path == '/topics') { // if you're switching topics staying on topic page                   if (!passedparams) {                       $state.reload(); // meaning refresh page, no topic selected.                   } else {                       $location.path(path).search({params: passedparams});                        $rootscope.$emit("callingtopicupdate", passedparams);                   }               } else { // works fine in loading correct topic, when on topic page (so above if), won't load scope changes.                   if (passedparams) {                       $location.path(path).search({params: passedparams});                   } else {                       $location.path(path);                   }               } }; $rootscope.$on("callingtopicupdate", function(event, param){             $scope.loadtopicview(param); });