MEAN堆棧 - NG-重複的內部NG-單擊不與數據庫

\t //app.js 
 

 
\t var blogApp = angular.module('BlogApp', []); //angular module setup, matches ng-app from index.html 
 
\t 
 

 
\t blogApp.controller('BlogController', function($scope, $http){ \t \t //have to add $http if your going to use http (inject the dependancy) 
 

 
\t \t $scope.createPost = createPost; //grabbing createPost from index.html (binding) 
 
\t \t $scope.deletePost = deletePost; //map deletePost from index.html 
 

 
\t \t function init(){ \t \t \t //put everything that happens when site first loads in init function, good practice 
 
\t \t \t getAllPosts(); 
 
\t \t } 
 

 
\t \t init(); \t \t \t \t \t \t //call init function to show all database posts 
 
\t \t 
 

 

 
\t \t function getAllPosts(){ \t \t \t \t \t \t \t //retrieve latest blogposts 
 

 
\t \t \t $http.get("/api/blogpost").success(function (posts){ \t \t //if its successfull, send posts back to client 
 

 
\t \t \t \t $scope.posts = posts; //send back to client using $scope 
 

 
\t \t \t }); 
 

 
\t \t } 
 

 

 
\t \t function createPost(post){ //taking post object from ng-model in index.html 
 

 
\t \t \t console.log(post); \t \t \t \t \t \t \t \t \t //displaying post information in console log on html site 
 
\t \t \t $http.post("/api/blogpost", post).success(getAllPosts); //push 'post' data to api/blogpost url, also call function getAllPosts when posting new post 
 
\t \t \t console.log(postId); 
 
\t \t } 
 

 
\t \t function deletePost(postId){ \t \t \t \t //deletePost is the same name as in index file for ng-click 
 
\t \t \t \t console.log(postId); 
 
\t \t \t \t $http.delete("/api/blogpost/"+postId).success(getAllPosts); //delete just one post with specific id, without + postId it would delete all posts 
 

 

 
\t \t } 
 

 

 
});

<!DOCTYPE html> 
 
<html lang="en" ng-app="BlogApp"> 
 
<head> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
    <script src="app.js"></script> 
 
\t <meta charset="UTF-8"> 
 
\t <title>Title</title> 
 
</head> 
 
<body> 
 

 
<div class="container" ng-controller="BlogController"> 
 
<h1>Blog</h1> \t 
 

 
<input ng-model="post.title" class="form-control" placeholder="title"/> 
 
<textarea ng-model="post.body" class="form-control" placeholder="body"></textarea/> 
 
<button ng-click="createPost(post)" class="btn btn-primary btn-block">Post</button> 
 

 

 
<div ng-repeat="post in posts"> 
 
<h2> 
 
\t {{post.title}} 
 
\t <a ng-click="deletPost(post._id)" class="pull-right"><span class="glyphicon glyphicon-remove"></span></a> 
 
</h2> 
 
<em>{{post.posted}}</em> 
 
<p> 
 
\t {{post.body}} 
 
</p> 
 
</div> 
 

 
\t {{posts}} 
 

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

工作出於某種原因，我的NG-Click按鍵是不是叫我deletePost（）函數。一直試圖弄清楚這幾個小時，不知道爲什麼它不工作。點擊圖標時，絕對沒有迴應。嘗試過的按鈕，以及仍然沒有迴應。有人看到我在做什麼錯了？

來源

2017-01-23 mstew1110

在你的描述，你把它叫做'deletePost（）'，但在你的代碼，它說'deletPost（崗位。 _id）'。錯字？ – Jason

謝謝是的，這是錯字，肯定是看着這個屏幕太長了。 – mstew1110

它不能正常工作，因爲拼寫錯誤：

ng-click="deletPost(post._id)"

到

ng-click="deletePost(post._id)"

來源

2017-01-23 19:14:53

非常感謝，不敢相信我沒有看到。至少現在我是ng-repeat中的ng-click專家，所有的研究都是我剛剛做的。 – mstew1110

哈哈真的。有一個美好的未來 –

MEAN堆棧 - NG-重複的內部NG-單擊不與數據庫

回答

相關問題