AngularJS：嵌套控制器不能在ng-include中工作

Question

As per the AngularJS article (have a look in nested controller fragment), I'm trying to implement nested controllers with ng-include 根据AngularJS文章（查看嵌套控制器片段），我正在尝试使用ng-include实现嵌套控制器

index.html index.html

<body id="spaWrapperApp" ng-app="spaWrapperApp">
        <div class="container-fluid" id="wrapper" ng-controller="mainController">
            <div class="navigation">
                <a href="javascript:void(0);" ng-click="requestPage('sample3_nestedApps_f1.html')">
                    <span>Page 1</span>
                </a>&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="javascript:void(0);" ng-click="requestPage('sample3_nestedApps_f2.html')">
                    <span>Page 2</span>
                </a>&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="javascript:void(0);" ng-click="requestPage('sample3_nestedApps_f3.html')">
                    <span>Page 3</span>
                </a>
            </div>
            <div id="content" >
                <div ng-include="currentPage"></div>
            </div>
        </div>

        <script type="text/javascript">
            window.spaWrapperApp = angular.module('spaWrapperApp',[]);

            spaWrapperApp.controller('mainController',['$scope',function($scope){

                $scope.currentPage = "sample3_nestedApps_f1.html";

                console.log($scope);
                $scope.requestPage = function(friendlyURL){
                    console.log(friendlyURL);
                    $scope.currentPage = friendlyURL;
                }
            }]);


        </script>
    </body>

Page1 (code given below)file will injected in ng-include Page1 （下面给出的代码）文件将被注入ng-include

<div>Testing page include 1</div>
<hr/>
<br/>
<div ng-controller="FirstController">
    <p>1# {{ name }}</p>
    <div ng-controller="SecondController">
        <p>2# {{ name }}</p>
    </div>
</div>
<script type="text/javascript">
    spaWrapperApp.controller('FirstController',['$scope',function($scope){
        $scope.name = "FirstController Name";
    }]);
    spaWrapperApp.controller('SecondController',['$scope',function($scope){
        $scope.name = "SecondController Name";
    }]);
</script>

In the whole case the end result will be nested controller injected in ng-include area. 在整个情况下，最终结果将嵌套控制器注入ng-include区域。

The issue is when I run that code that time this error is shown to me. 问题是，当我在那个时间运行该代码时，此错误显示给我。

"Error: [ng:areq] Argument 'FirstController' is not a function, got undefined"

Any idea what exactly going wrong ? 知道到底出了什么问题吗？

Answer 1

Something unexpected going in AngularJS. AngularJS中发生了意外情况。

If you are using ng-include and try to inject pageX in that area and pageX contains some script, in that case pageX script not executed, for that I just write all the angularJS controllers handler in index.html only and it works fine for me. 如果您正在使用ng-include并尝试在该区域中注入pageX并且pageX包含一些脚本，在这种情况下，不会执行pageX脚本，为此，我只在index.html中编写了所有angularJS控制器处理程序，它对我来说很好用。 like 喜欢

    window.spaWrapperApp = angular.module('spaWrapperApp',[]);
    spaWrapperApp.controller('mainController',['$scope',function($scope){
        $scope.currentPage = "sample3_nestedApps_f1.html";
        $scope.requestPage = function(friendlyURL){
            $scope.currentPage = friendlyURL;
        }
    }]);
    spaWrapperApp.controller('FirstController',['$scope',function($scope){
        $scope.name = "FirstController Name";
    }]);
    spaWrapperApp.controller('SecondController',['$scope',function($scope){
        $scope.name = "SecondController Name";
    }]);

AngularJS：嵌套控制器不能在ng-include中工作

问题描述

1 个解决方案

解决方案1
0 2015-10-29 15:01:00

AngularJS：嵌套控制器不能在ng-include中工作

问题描述

1 个解决方案

解决方案1 0 2015-10-29 15:01:00

解决方案1
0 2015-10-29 15:01:00