如何使用不同的控制器（AngularJs）创建嵌套分区？_Angularjs

如何使用不同的控制器（AngularJs）创建嵌套分区？

angularjs

如何使用不同的控制器（AngularJs）创建嵌套分区？,angularjs,Angularjs,如何在另一个div中创建div元素，以及在同一级别中动态创建其他div元素 [此图显示了我正在努力实现的目标] 问题是，当我想添加GrianContenu时，控制台会向我显示GrainContenu函数是未定义的，但它是与除法一起工作的有人能帮我添加我的元素吗？就像图中所示这是我的app.html、app.js和rightclickdirection.app app.js rightClickDirective.js app.html 我已经创建了一个plunker来重新创建上面的代码片段

如何在另一个div中创建div元素，以及在同一级别中动态创建其他div元素

[此图显示了我正在努力实现的目标]

问题是，当我想添加GrianContenu时，控制台会向我显示GrainContenu函数是未定义的，但它是与除法一起工作的

有人能帮我添加我的元素吗？就像图中所示

这是我的app.html、app.js和rightclickdirection.app

app.js

rightClickDirective.js

app.html

我已经创建了一个plunker来重新创建上面的代码片段。问题似乎是您当前的控制器层次结构是

-DivisionController
  |-RightClickCtrl (has no idea about GrainContenu)
  |  |--GrainContenuCtrl (GrainContenu)
  |- etc...

函数GrainContenu是在graincontonuctrl中定义的。“RightClickCtrl”不知道它的存在并不完全正确，因为您可以遍历$scope层次结构来查找-我认为这并不理想

只需简单地将“GrainConductRL”移动到“RightClickCtrl”之上，这样RightClickCtrl就不会从GrainConductRL继承任何原型，从而允许它访问GrainContenu函数

-DivisionController
  |--GrainContenuCtrl (GrainContenu)
  |   |-RightClickCtrl (prototypically inherits from GrainContenuCtrl ) 
  |- etc...

关于AngularJS中原型继承的更多信息，请参考答案。

代码太多。.请重构它并只添加相关代码。.很难阅读。你需要无限嵌套吗？是@Dmitri Zaitsev，无限整洁

<html>
<head>
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap/bootstrap-theme.min.css">
</head>
<body ng-app="Webapp" ng-controller="DivisionCtrl">

    <h1>Module Opale</h1>
    Titre<input type="text" placeholder="Titre"><br />
    Metadonnées<input type="text" placeholder="Titre"><br />
    Objectif du module<input type="text" placeholder="Objectif">

        <div ng-controller="RightClickCtrl" context="context1">
        <div class="form-group" data-ng-repeat="division in divisions" ng-controller="GrainContenuCtrl">
            <h2>Division</h2>
            Titre<input type="text" placeholder="Titre">
            <br />Titre court
            <input type="text" placeholder="Titre"><br />
                <div class="form-group" data-ng-repeat="grainContenu in grainContenus">

                    <h3>Grain de Contenu</h3>
                    Titre<input type="text" placeholder="Titre"><br />
                    Titre court<input type="text" placeholder="Titre"><br />
                    <h4>Information</h4>
                    Titre<input type="text" placeholder="Titre"><br />
                    <textarea rows="4" cols="50"></textarea><br />
                </div>
            <hr />
            </div>

            <ul id="context1" class="dropdown-menu">
              <li><a ng-click="GrainContenu()">Grain de Contenu</a></li>
              <li><a ng-click="Division()">Division</a></li>
              <li><a ng-click="QCU()">Exercice:QCU</a></li>
              <li><a ng-click="QCM()">Exercice:QCM</a></li>
            </ul>
        </div>
    <script type="text/javascript"    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-sanitize.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/rightClickDirective.js"></script>
    <script type="text/javascript" src="js/plugins/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="js/plugins/jquery/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/plugins/bootstrap/bootstrap.min.js"></script>   
</body>
</html>

-DivisionController
  |-RightClickCtrl (has no idea about GrainContenu)
  |  |--GrainContenuCtrl (GrainContenu)
  |- etc...

-DivisionController
  |--GrainContenuCtrl (GrainContenu)
  |   |-RightClickCtrl (prototypically inherits from GrainContenuCtrl ) 
  |- etc...