Angular应用无法启动

Question

我在另一个页面中复制了有效的解决方案，但是由于某种原因它无法正常工作； 这是一个测试代码：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="MyCtrl" ng-app="myapp">
    <table name="commentsTable">
        <tr ng-repeat="item in items = obj track by $index">
            <td class="plantCell">{{items[$index].nome}}: </td>
            <td class="statusCell">{{items[$index].status}}</td>
            <td class="statusCell">{{items[$index].testo}}</td>
        </tr>
    </table>
</div>
<script language="javascript">
    var app = angular.module('myapp', []);
    var printOperation;

    function GetFromLocalStorage(key) {
        var items = localStorage.getItem(key);
        console.log(items);
        if (items === null) {
            console.log("item null");
            return null;
        } else {
            if (typeof items != "string") {
                items = JSON.stringify(items);
            }
            return items;
        }
    }
    app.controller('MyCtrl',
        function($scope) {
            $scope.printComments = function() {
                $scope.obj = [{
                    "nome": "first",
                    "status": 1,
                    "testo": "Rottura rullo 1!!!"
                }, {
                    "nome": "second",
                    "status": 0,
                    "testo": "Rottura rullo fsdfsf!!!"
                }];
                console.log("ricevo evento");
                console.log($scope.obj);
            }
            console.log("assegno print operation");
            printOperation = $scope.printComments;
        }
    );
    var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
            var eventer = window[eventMethod];
            var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
            eventer(messageEvent,function(e) {
                console.log("ricevo messaggio");
                printOperation();
            },false);
</script>

由于某种原因，出现的所有内容是：

{{items [$ index] .nome}}：{{items [$ index] .status}} {{items [$ index] .testo}}

我有以下错误，例如从未进行过分配：

printOperation不是函数

函数（$ scope）从未调用过。

就像没有加载角度库一样。 怎么了？

Answer 1

您缺少ng-app="myapp"并且也更改了ng-repeat

<div ng-app="myapp" ng-controller="MyCtrl">
    <table name="commentsTable">
        <tr ng-repeat="item in obj track by $index">
            <td class="plantCell">{{items[$index].nome}}: </td>
        <td class="statusCell">{{items[$index].status}}</td>
        <td class="statusCell">{{items[$index].testo}}</td>
    </tr>
    </table>
</div>

printOperation不在角度范围内。 尝试使所有内容都在角度范围内。

不要使用全局变量。

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myapp" ng-controller="MyCtrl"> <table name="commentsTable"> <tr ng-repeat="item in obj track by $index"> <td class="plantCell">{{item.nome}}: </td> <td class="statusCell">{{item.status}}</td> <td class="statusCell">{{item.testo}}</td> </tr> </table> </div> <script language="javascript"> var app = angular.module('myapp', []); var printOperation; function GetFromLocalStorage(key) { var items = localStorage.getItem(key); console.log(items); if (items === null) { console.log("item null"); return null; } else { if (typeof items != "string") { items = JSON.stringify(items); } return items; } } app.controller('MyCtrl', function($scope,$window) { $scope.printComments = function() { $scope.obj = [{ "nome": "first", "status": 1, "testo": "Rottura rullo 1!!!" }, { "nome": "second", "status": 0, "testo": "Rottura rullo fsdfsf!!!" }]; console.log("ricevo evento"); console.log($scope.obj); } console.log("assegno print operation"); $scope.printComments(); } ); </script> 

Answer 2

您应该添加ng-app="myapp"以启动AngularJS。

您的代码试图将变量设置为AngularJS世界之外的Angular代码：您不能。 但是幸运的是，您并没有真正设置var printOperation ：在实例化控制器时直接调用该函数。

注意，我对您的表进行了一些更改以使其可显示。

 var app = angular.module('myapp', []); function GetFromLocalStorage(key) { var items = localStorage.getItem(key); console.log(items); if (items === null) { console.log("item null"); return null; } else { if (typeof items != "string") { items = JSON.stringify(items); } return items; } } app.controller('MyCtrl', function($scope) { $scope.printComments = function() { $scope.obj = [{ "nome": "first", "status": 1, "testo": "Rottura rullo 1!!!" }, { "nome": "second", "status": 0, "testo": "Rottura rullo fsdfsf!!!" }]; console.log("ricevo evento"); console.log($scope.obj); } console.log("assegno print operation"); $scope.printComments(); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myapp" ng-controller="MyCtrl"> <table name="commentsTable"> <tr ng-repeat="item in obj"> <td class="plantCell">{{item.nome}}: </td> <td class="statusCell">{{item.status}}</td> <td class="statusCell">{{item.testo}}</td> </tr> </table> </div>