我是Angular的新手,这是我第一次处理路由,所以如果我的问题有点令人困惑,请原谅。我对这个应用程序的实际逻辑和结构要复杂得多,而且我正在使用多种服务,但这是我遇到问题的部分的一般概念。我将衷心感谢您的帮助!感谢。
已更新 jsFiddle:http://jsfiddle.net/GeorgiAngelov/9yN3Z/106/
我感谢Chandermani更新了我的小提琴(我删除了所有控制器并只留下了它的一个副本)但是现在每当我点击Add Root按钮或者当我点击时,我就会得到“10 $ digest()迭代”我点击它一直给我错误的部分......不知道为什么。
所以我有一个应用程序,我的左侧有一个菜单,我可以在该菜单中添加更多名为 sections 的元素。该菜单部分项来自位于我的控制器中的名为 sections 的数组,当您添加部分时,它会将其添加到名为的数组中的部分
$scope.sectionId = $routeParams.sectionId;
$scope.sections = [];
$scope.counter = 1;
$scope.section = {};
$scope.addSection = function(){
$scope.sections.push({
id: $scope.counter++,
name: 'Random Name',
roots: []
});
};
* HTML * * *
<body ng-app="myApp" ng-controller="MyController">
<div class="tabbable tabs-left pull-left">
<ul class="nav nav-tabs">
<li ng-repeat="section in sections" ng-click="setSectionSelected(section)" ng-class="{active : isSectionSelected(section)}"><a href="#/section/{{section.id}}" data-toggle="tab">{{section.name}}</a></li>
</ul>
<button class="addSection btn btn-success" ng-click="addSection()" style="position:relative; bottom: 0;">Add Section</button>
</div>
<div >
<div class="tab-pane" ng-class="{active : isSectionSelected(section)}" id="{{section.id}}" ng-repeat="section in sections">
</div>
</div>
<div ng-view></div>
</body>
该数组中的每个对象都有另一个名为 roots 的数组,另一个名为添加根的按钮,我想将对象(元素)推送到我目前的任何部分on,取决于$ routeParams id变量。
$scope.addRoot = function(section){
section.roots.push({
id: $scope.counter++,
name: 'Random Root',
});
};
从路由器调用的HTML模板
<script type="text/ng-template" id="/tpl.html">
<div class="map-container">
<div class="map">
<h2>{{section.name}}</h2>
<h4>{{section.description}}</h4>
<button class="add btn btn-success" ng-click="addRoot(section)">Add Root</button>
<div ng-repeat="root in section.roots" ng-include="'/tpl.html'"></div>
</div>
</div>
</script>
app.config(function ($routeProvider) {
$routeProvider
.when('/section', {
templateUrl: '/tpl.html',
sectionId: '1',
})
.when('/section/:sectionId', {
templateUrl: '/tpl.html',
})
.otherwise({
redirectTo: '/'
});
});