Ste*_*eve 6 angularjs angularjs-scope
我有一些部分模板,根据用户操作通过ng-click更改位置:
<div ng-include="contentUrl"></div>
<button ng-click="contentUrl = '../partials/testScriptForm.html'">Add Test Script</button>
Run Code Online (Sandbox Code Playgroud)
除非我上面的按钮位于部分内部,否则这很有用,所以如果testScriptForm.html有一个按钮:
<button ng-click="contentUrl = '../partials/testScriptCase.html'">Add Test Case</button>
Run Code Online (Sandbox Code Playgroud)
然后什么都没发生
这似乎是由于ng-include获得了一个新的(继承但未共享的)范围.
我无法想象的是如何获得包含的模板(部分)来改变自己的位置.
我确实尝试了一个函数来改变$ scope.$ parent.contentUrl,它似乎确实改变但没有"传播"这些改变.
在coffeescript中:
$scope.changeParentLocation = (location) ->
$scope.$parent.contentUrl = location
Run Code Online (Sandbox Code Playgroud)
还尝试$ scope.$ apply()和$ scope.$ parent.$ apply()在那里得到错误:
错误:[$ rootScope:inprog] http://errors.angularjs.org/1.2.0rc1/ $ rootScope/inprog?p0 =%24apply
也许我只是误用了包括......
使用"点模型"参考来逃避隔离范围:
<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>
Run Code Online (Sandbox Code Playgroud)
function Ctrl($scope) {
$scope.tpl = {};
$scope.tpl.contentUrl = '/partials/testScriptForm.html';
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
6003 次 |
| 最近记录: |