Question

Iam新手到Angular并表达Frameworks.Iam开发一个简单的服务器，它响应给定的路由并显示在控制器中声明的变量的值。但是有一个错误，例如控制器没有定义。这是为方便起见，controller存储在client / js / controllers文件夹中整个项目的代码在这里

的index.html

<!DOCTYPE html>
<html ng-app="">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Document</title>
    <meta name="description" content="">
    <meta name ="viewport" content ="width=device-width ,initial-scale =0">
</head>
<body>

    <!-- Meetups View -->
    <div ng-controller="meetupsController">
        <h1>There are {{meetupsCount}} meetups</h1>
        <!-- <ul>
            <li ng-repeat="meetup in meetups">
                {{meetup.name}}
            </li>
        </ul> -->
        <!-- <form ng-submit="createMeetup()">
            <input type="text" placeholder="Meetup Name" ng-model="meetupName"></input>
            <button type="submit">Add</button>
        </form> -->
    </div>

    <!-- <a href="">Hello World</a> -->
     <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <script  src="/js/controllers/meetups-controller.js"></script>
</body>
</html>

聚会-controller.js

function meetupsController ($scope) {
    $scope.meetupsCount = 10;

    // $scope.meetups = [
 //     { name : "Meet 1"},
 //     { name : "Meet 2"},
 //     { name : "Meet 3"}
    // ]
    // $scope.createMeetup =  function () {
    //  $scope.meetups.push({ name : $scope.meetupsName});
    //  $scope.meetupsName = '';
    // }
}

main.js

// console.log("Hello from node");

//Express server

var express = require('express');
    app = express();

app.get('/' , function(req ,res) {
    res.sendFile(__dirname + '/client/views/index.html');
});

app.use('/js',express.static(__dirname +'/client/js'));

app.listen(3000 ,function () {
    console.log('Im Listening .... ');
});

错误日志在这里

angular.js:12520 Error: [ng:areq] http://errors.angularjs.org/1.4.8/ng/areq?p0=meetupsController&p1=not%20a%20function%2C%20got%20undefined
    at Error (native)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:6:416
    at qb (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:22:131)
    at Qa (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:22:218)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:80:210
    at w (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:60:177)
    at D (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:61:30)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:55:105)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:55:122)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:55:122)

Answer 1

您尚未定义Angular应用（ng-app=""）并且尚未在角应用中注册您的控制器。

meetups-controller.js（在文件底部添加）：

var app = angular.module('myApp', []);
app.controller('meetupsController', meetupsController);

index.html（更改）：

<html ng-app="myApp">

Answer 2

这适用于较旧版本的角度而非新版本将角度版本更改为

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

或在js文件中定义模块以使用最新的角度版本

var app = angular.module('app', []);
app.controller('meetupsController', meetupsController);


function meetupsController ($scope) {
    $scope.meetupsCount = 10;
}

in html

<html ng-app="app">

争论＆＃39; meetupsController＆＃39;不是函数，得到undefined错误

2 个答案: