All geek questions in one place

AngularJS ngInclude dynamically changes its location

I have several partial templates where the location changes based on user actions via ng-click:

<div ng-include="contentUrl"></div> <button ng-click="contentUrl = '../partials/testScriptForm.html'">Add Test Script</button>

This works fine if I don't find the above in the partial part, so if testScriptForm.html has a button:

 <button ng-click="contentUrl = '../partials/testScriptCase.html'">Add Test Case</button>

Then nothing happens.

This is because ng-include gets a new (inherited but not shared?) Area.

I cannot figure out how to get the included template (partial) to change its own location.

I tried a function to change $ scope. $ parent.contentUrl, it seems to be changing, but not “propagating” the changes.

In coffeescript:

  $scope.changeParentLocation = (location) -> $scope.$parent.contentUrl = location

Also tried using $ scope. $ apply () and $ scope. $ parent. $ apply () there and get the error:

Error: [$ rootScope: inprog] http://errors.angularjs.org/1.2.0rc1/ $ rootScope / inprog? p0 =% 24apply

Maybe I'm just misusing it ...

+6
source share
1 answer

Reset the selection using the dotted model link:

 <html ng-app> <head> <script src="http://code.angularjs.org/1.1.5/angular.min.js"></script> <script src="script.js"></script> <script type="text/ng-template" charset="utf-8" id="/partials/testScriptForm.html"> <h1>This is testScriptForm.html</h1> <button ng-click="tpl.contentUrl = '/partials/testScriptCase.html'">Change to Test Case</button> </script> <script type="text/ng-template" charset="utf-8" id="/partials/testScriptCase.html"> <h1>This is testScriptCase.html</h1> <button ng-click="tpl.contentUrl = '/partials/testScriptForm.html'">Change to Test Form</button> </script> </head> <body> <div ng-controller="Ctrl"> <fieldset> <div ng-include="tpl.contentUrl"></div> </fieldset> </div> </body> </html> 
 function Ctrl($scope) { $scope.tpl = {}; $scope.tpl.contentUrl = '/partials/testScriptForm.html'; }
+7
source

Source: https://habr.com/ru/post/954753/

More articles:


All Articles