angularjs ng-controller inside ng-controller

Question

I have a ng-controller in _Layout page like this.

  <div ng-controller="LayoutController">
left content....
    @RenderBody
right content..

And using angular module in layout with ajax ( that part works )

  <script type="text/javascript">
    var module_ = angular.module("myapp", []);
    var controller_ = module_.controller("layoutController", function ($scope) {
        $.ajax({
            type: "POST",
            url: "Home/GetMenu",
            success: function (result) {
                $.each(result, function (i, ix) {
                    result[i].ID = i + 1;
                });
                $scope.TopCharactersModel = result;
                $scope.$apply();
            },
            complete: function () {

            }
        })

Then i want to use another Ng-Controller inside Index.html which derived from this layout page. Javascript code is not work at this side and chrome debugger show this error WARNING: Tried to load angular more than once.

    <div ng-controller="IndexController">
     <div class="panel-group" id="accordion" ng-repeat="arr_ in newsArr">
 </div>
</div>



 <script>
        var module = angular.module("myapp", []);
        var myController1 = module_.controller("IndexController", function ($scope) {

            $.ajax({
                url: "Home/GetNews",
                type: "POST",
                success: function (result) {
                    $scope.newsArr = result;
                    //  $scope.$digest();
                    $scope.$apply()
                },
                complete: function () {
                }
            });
        });

    </script>

Assuming you are within the same app and you're not creating some sort of hybrid application with multiple spa's... you are in fact redeclaring the module: myapp. If you need a reference to the myapp module remove the [] from `angular.module("myapp", []);` — skubski, Jun 30 '15 at 10:17

ishakya · Answer 1 · 2015-07-01T04:18:55.593

1

For second controller try this.

<script>
var module = angular.module("myapp", []);
var myController1 = module.controller("IndexController", function ($scope) {
 $.ajax({
            url: "Home/GetNews",
            type: "POST",
            success: function (result) {
                $scope.newsArr = result;
                //  $scope.$digest();
                $scope.$apply()
            },
            complete: function () {
            }
        });
    });
</script>

edited Jul 01 '15 at 04:18

answered Jun 30 '15 at 10:20

ishakya

289
3
5
13

I did but nothing changed – Burak Dincer Jun 30 '15 at 10:22
In second controller, variable name for angular module doesn't match the one you used to define controller. Try fixing that. – ishakya Jul 01 '15 at 04:25

score 0 · Accepted Answer · answered Jun 30 '15 at 10:20

0

Assuming you are within the same app and you're not creating some sort of hybrid application with multiple spa's... you are in fact redeclaring the module: myapp. If you need a reference to the myapp module remove the [] from angular.module("myapp", []);

Creation versus Retrieval Beware that using angular.module('myModule', []) will create the module myModule and overwrite any existing module named myModule. Use angular.module('myModule') to retrieve an existing module.

Pasted from module documentation.

answered Jun 30 '15 at 10:20

skubski

1,586
2
19
25

thanks for advice i fix it. but its not a solution of my problem – Burak Dincer Jun 30 '15 at 10:25
Did you use `ng-app="myApp"` multiple times? – skubski Jun 30 '15 at 10:29
nop, its only defined in Layout page , actually i dont care about that error "Tried to load angular more than once." . I just need to call ajax script from index page for load data into into ng-repeat – Burak Dincer Jun 30 '15 at 10:45
Well, there is a service in angular that you can use.... [$http](https://docs.angularjs.org/api/ng/service/$http) , there is no need to use JQuery. I think you could be in some infinite loop where you render the layout page multiple times. I think you should fix that first tbh. – skubski Jun 30 '15 at 10:50
thanks for helps. I used razor on layout page and passed to error – Burak Dincer Jun 30 '15 at 11:47

angularjs ng-controller inside ng-controller

2 Answers2