1

我对 Angular 很陌生，这是我第一次处理路由，所以如果我的问题有点令人困惑，请原谅。这个应用程序的实际逻辑和结构要复杂得多，并且我正在使用多种服务，但这是我遇到问题的部分的总体思路。我将衷心感谢您的帮助！谢谢。

解决了

我正在递归地添加相同的模板。在模板中，我将 ng-repeat 模板更改为另一个模板，它运行良好。 http://jsfiddle.net/GeorgiAngelov/9yN3Z/111/

更新的 jsFiddle：http: //jsfiddle.net/GeorgiAngelov/9yN3Z/106/

感谢Chandermani，我更新了我的小提琴（我删除了所有控制器并只留下了一个副本）但现在每当我单击“添加根”按钮或单击某个部分时，我都会得到“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>

该数组中的每个对象都有另一个名为 root 的数组和另一个名为Add Root的按钮，我想将对象（元素）推送到我当前所在的任何部分，具体取决于 $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: '/'
      });
  });
4

0 回答 0