无法添加第二个 ng-controller

Question

I am pretty new in angular/js development so now i stacked with this.我在 angular/js 开发方面很新，所以现在我用这个。

When I add ng-controller="HeaderController" to my HTML code it cant load Angular.当我将ng-controller="HeaderController" 添加到我的 HTML 代码时，它无法加载 Angular。 If you remove this everything is fine.如果你删除它，一切都很好。 Why that happened?为什么会这样？ Thanks for any help and sorry for bad English :)感谢您的帮助，对英语不好表示抱歉:)

Code:代码：

 (function() { var app = angular.module ('FunStuff',[]); app.controller ('TextController',['$scope',function($scope){ $scope.stuff = []; $scope.add = function(){ $scope.stuff.push ($scope.name); } }]); app.controller ('HeaderController'['$scope',function($scope){ $scope.textClass = ''; $scope.changeClrClss = function(name){ $scope.ClrClss = name; } }]); })();

 <!DOCTYPE html> <html ng-app ="FunStuff"> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.32/angular.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <title>LEARN JS</title> <meta charset="utf-8"> </head> <body > <header ng-class = "ColorClass" ng-controller="HeaderController"> <h1>$~/Path_To_Js/</h1> <button class="changeColorBtn" ng-click="changeColorClass('white')"> ChangeColorButton </button> </header> <div class="wrapper" > <article ng-controller = "TextController"> <p>There will be some information</p> <form ng-submit="add()"> <input ng-model="name"><button>Add</button> </form> <ul class="buttons" ng-repeat= "n in stuff track by $index"> <li>{{n}}</li> </ul> </article> </div> <script type="text/javascript" src="index.js"></script> </body> </html>

Answer 1

As your error says, You are missing , after the header controller,由于您的错误说，你缺失,头控制器后，

app.controller ('HeaderController',['$scope',function($scope){
        $scope.textClass = '';
        $scope.changeClrClss = function(name){
            $scope.ClrClss = name;
        }
    }]);

DEMO演示

 var app = angular.module ('FunStuff',[]); app.controller ('TextController',['$scope',function($scope){ $scope.stuff = []; $scope.add = function(){ $scope.stuff.push ($scope.name); } }]); app.controller ('HeaderController',['$scope',function($scope){ $scope.textClass = ''; $scope.changeClrClss = function(name){ $scope.ClrClss = name; } }]);

 <!DOCTYPE html> <html ng-app ="FunStuff"> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.32/angular.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <title>LEARN JS</title> <meta charset="utf-8"> </head> <body > <header ng-class = "ColorClass" ng-controller="HeaderController"> <h1>$~/Path_To_Js/</h1> <button class="changeColorBtn" ng-click="changeColorClass('white')"> ChangeColorButton </button> </header> <div class="wrapper" > <article ng-controller = "TextController"> <p>There will be some information</p> <form ng-submit="add()"> <input ng-model="name"><button>Add</button> </form> <ul class="buttons" ng-repeat= "n in stuff track by $index"> <li>{{n}}</li> </ul> </article> </div> <script type="text/javascript" src="index.js"></script> </body> </html>

Answer 2

(function() {
    var app = angular.module ('FunStuff',[]);

    app.controller ('TextController',['$scope',function($scope){
        $scope.stuff = [];
        $scope.add = function(){
                $scope.stuff.push ($scope.name);
        }
    }]);
    app.controller ('HeaderController',['$scope',function($scope){
                                    //^^ missing comma here
        $scope.textClass = '';
        $scope.changeClrClss = function(name){
            $scope.ClrClss = name;
        }
    }]);
})();

无法添加第二个 ng-controller

问题描述

2 个解决方案

解决方案1
1 已采纳 2017-02-07 13:33:35

解决方案2
0 2017-02-07 13:32:42

无法添加第二个 ng-controller

问题描述

2 个解决方案

解决方案1 1 已采纳 2017-02-07 13:33:35

解决方案2 0 2017-02-07 13:32:42

解决方案1
1 已采纳 2017-02-07 13:33:35

解决方案2
0 2017-02-07 13:32:42