How to change root node dynamically

[hotpeperoncino]

Hi.

I wrote like following $scope.bag = some-tree-data ; // when bag has already kept some value. if not, it is effective. it cannot change anything on dom.

Can I have how to update the root node dynamically?

[jtrussell]

I'm not sure I fully understand the issue, would you mind creating a demo?

Perhaps starting from this starter template - http://jsbin.com/wecafa/2/edit?html,js,output

[hotpeperoncino]

Here: I want to update from stuff to stuff2 by clicking update button. http://jsbin.com/xozuwacuwe/1/edit?html,js,output Maybe I should remove DOM elements and add new nodes. But I don't know how to do it. Thanks.

[jtrussell]

I see, there were just a couple issues with that example.

When you reference this inside a function on $scope --> this === $scope. It looks like you may have though this was a reference to the controller instance. The easiest thing to do is just store a reference to the controller instance and use that in your functions on $scope. It's probably a good idea to avoid mixing assignments to $scope and the controller instance where possible and just pick one. I typically won't use $scope to expose data or functions to the view at all.

Also, (a minor thing that I'm guessing wasn't an issue in your actual code) that update button should be inside the ng-control block, outside it won't have access to the correct scope.

Here's your example working with those small changes made: http://jsbin.com/qofipilide/edit?html,js,output

[hotpeperoncino]

Thank for your answer. I could not shorten my problem correctly. I understand your intention which is that the special function invocation is not required to rewrite the tree data. My long code still does not work well.

FYI only, My code fragment is like follows

  $scope.showTree = function() {
    console.log( $scope == this); <-- true

      var p = dataService.getbag();
      p.then(
          function (data) {
            console.log("bagdata=",data);
            $scope.bag = data.data;   <- it cannot rewrite previous tree data
            $scope.bag1 = data.data;  <- it show correctly; previous tree is nothing.
          }
      );
  };

---

Html fragment is like following.