Angularjs代码不工作

我最近一直在教我自己的angularjs以及node.js，从我学到的东西我写了这段代码，但它不起作用，我试着在控制器中记录一些东西，它没有记录它，所以也许这是对什么是错index.html的代码提示：（提前对不起，如果我的代码是凌乱或任何东西）Angularjs代码不工作

<!Doctype html> 
<html ng-app="Test"> 
<head> 
<title>Test</title> 

<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css"> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<script type="text/javascript" src="angular.min.js"></script> 
<script type="text/javascript" src="angular-route.js"></script> 
<script type="text/javascript"> 
var app= angular.module('Test' , ['ngRoute']); 

app.controller('TestController' , function($scope , $http){ 



     $scope.submitBlog = function(){ 



      $http.post('/blogs' , {blog : $scope.blog}).then(function(){ 

       alert("success"); 
      }); 
     }; 
}); 
</script> 

</head> 
<body ng-app> 

<h2>Blog It!</h2> 
<br><br> 
<div class="test" > 
<input type="text" , placeholder="Username"> 
<br><br> 
<input type="password" , placeholder="Password"> 
<br><br> 
<button type="button" > Log In</button> 
<br><br> 
<a href="">Not a member ? Sign Up!</a> 
</div> 

<div class="blogfeed"> 

<h5>Feed :</h5> 
<input ng-model="blog" placeholder="Your thoughts?" > 
<button type="button" , ng-click="submitBlog()" , class="btn">Submit</button> 

</div> 
</body> 
</html>

Server代码：

var MongoClient = require('mongodb').MongoClient; 
var ObjectId = require('mongodb').ObjectId; 
var express = require('express'); 
var bodyParser = require('body-parser'); 
var bcrypt = require('bcryptjs'); 

var app = express(); 
var db = null; 

MongoClient.connect("mongodb://localhost:27017/test" , function(err,dbconn){ 
if(!err){ 
console.log("We are connected"); 
db= dbconn; 
} 
}); 

app.use(express.static('public')); 
app.use(bodyParser.json()); 

app.post('/blogs' , function(res,req,next){ 
db.collection('blogs' , function(err , blogsCollection){ 
      var newBlog= { 
       text: req.body.blog 
      }; 
     blogsCollection.insert(newBlog , {w:1} , function(err){ 

      return res.send(); 
     }); 
    }); 
}); 
app.listen(3000, function(){ 

console.log('Example app listening on port 3000'); 

});

来源

2016-09-03 TheKSH991

欢迎堆栈溢出！您可以帮助我们通过格式化代码来提高可读性，因此我们无需滚动它。 – zhon

嗨:)，好吧，希望下次它会更加简洁和有条理，感谢您的输入 – TheKSH991

您正在创建从未使用过的控制器。

你有你的控制器与ng-controller指令

绑定到DOM元素，你可以把它添加到body标签，像这样

<body ng-app ng-controller="TestController" >

来源

2016-09-03 17:44:42 eltonkamami

它的工作现在，非常感谢你，但还有一个问题，服务器给我一个内部错误，它告诉我我im插入到数据库中的属性是未定义的（这是博客） – TheKSH991

@ TheKSH991表示中间件的签名是'function（req，res，next）{}''你需要交换'req'和'res'。你正试图从现在的反应中获得身体。它是附加请求 – eltonkamami

哦哇，多谢m8，你真的很有帮助，我觉得像一个白痴由于这些问题是多么微小的xD，再次感谢:) – TheKSH991

检查。您已创建了ng-app，即Test和控制器TestController。但你从来没有用过它。如果您想在整个机身上使用控制器，例如整个应用的一个控制器，则在body标签上使用ng-controller="TestController"。如果您希望将控制器的scope限制为特定元素的子元素，则也可以使用其他元素。

<!Doctype html> 
 
<html ng-app="Test"> 
 

 
<head> 
 
    <title>Test</title> 
 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.5/angular.min.js"></script> 
 
    <script type="text/javascript"> 
 
    var app = angular.module('Test', []); 
 

 
    app.controller('TestController', function($scope, $http) { 
 
     console.log('In the controller'); 
 
     $scope.submitBlog = function() { 
 

 

 

 
     $http.post('/blogs', { 
 
      blog: $scope.blog 
 
     }).then(function() { 
 

 
      alert("success"); 
 
     }); 
 
     }; 
 
    }); 
 
    </script> 
 

 
</head> 
 

 
<body ng-controller="TestController"> 
 

 
    <h2>Blog It!</h2> 
 
    <br> 
 
    <br> 
 
    <div class="test"> 
 
    <input type="text" , placeholder="Username"> 
 
    <br> 
 
    <br> 
 
    <input type="password" , placeholder="Password"> 
 
    <br> 
 
    <br> 
 
    <button type="button">Log In</button> 
 
    <br> 
 
    <br> 
 
    <a href="">Not a member ? Sign Up!</a> 
 
    </div> 
 

 
    <div class="blogfeed"> 
 

 
    <h5>Feed :</h5> 
 
    <input ng-model="blog" placeholder="Your thoughts?"> 
 
    <button type="button" , ng-click="submitBlog()" , class="btn">Submit</button> 
 

 
    </div> 
 
</body> 
 

 
</html>

来源

2016-09-03 17:49:04

Angularjs代码不工作

回答

相关问题