0

我是 Angular 的新手,我正在使用 phpStorm 工具来学习它。看起来我做的一切都是正确的,但是当我执行以下 html 和 Javascript 代码时仍然无法获得正确的结果,我对此进行了大量研究,并确保我遵循了提供的解决方案而没有一步先:

索引.html

    <!DOCTYPE html>
<html ng-app="myApp" >
<head >
    <title>Ang Tut</title>
    <meta charset="UTF-8">
</head>
<body>
<h1>Groups</h1>

<div  ng-controller="GroupController">

    <ul>
        <li ng-repeat="group in groups" ng-model="group.group_name">
            {{group.group_name}}
        </li>
    </ul>


</div>

</body>

<script type="text/javascript" src="angular.min.js"></script>

<script type="text/javascript" src="app.js"></script>


</html>

和我的 app.js 文件:

var app = angular.module("myApp", []);

    app.controller("GroupController", function($scope){
        $scope.groups= [
            {"id":"144","group_name":"new grouppp"},
            {"id":"303","group_name":"Combination group"},
            {"id":"323","group_name":"pcb"}
        ]

    });
4

3 回答 3

1

相同的代码正在运行,angular.min.js 可能未正确包含,请使用 http:// 而不是 file:// 访问您的 index.html 文件

var app = angular.module("myApp", []);

    app.controller("GroupController", function($scope){
        $scope.groups= [
            {"id":"144","group_name":"new grouppp"},
            {"id":"303","group_name":"Combination group"},
            {"id":"323","group_name":"pcb"}
        ]

    });
<!DOCTYPE html>
<html ng-app="myApp" >
<head >
    <title>Ang Tut</title>
    <meta charset="UTF-8">
</head>
<body>
<h1>Groups</h1>

<div  ng-controller="GroupController">

    <ul>
        <li ng-repeat="group in groups" ng-model="group.group_name">
            {{group.group_name}}
        </li>
    </ul>


</div>

</body>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>


</html>

于 2015-11-04T13:33:25.000 回答
0

我不得不更改 js 文件,因此在它的开头包含“function()”,并在结尾行包含“()”。这解决了问题

于 2015-11-04T14:14:07.030 回答
0

您必须包含ngRoute在您的项目中。

<script src="angular-route.js">您可以在此处获取此文件。

在你的app.js

var app = angular.module("myApp", ['ngRoute']);

它将开始正常工作。

现在,这在 jsFiddle 中有效但在本地无效的原因。

那是因为如果您查看下 jsFiddle 中的左窗格Frameworks & Extensions,您会发现选定的选项是no wrap - in <body>

这意味着您在 js fiddle 的 javascript 块中编写的代码将放置在生成的 html 的 body 标记内,因此您不需要ngRoute.

但是在本地运行时,我看到您的模块初始化在不同的文件中,即。app.js这就是ngRoute出现的地方。

在旧版本的 Angular 中,ngRoute 包含在 Angular 本身中。但是在最新版本(不确定来自哪个版本)中,ngRoute模块是单独提供的。

于 2015-11-05T06:30:05.567 回答