$scope vs. Controller As
Example of $scope vs. Controller As
by Sajeetharan Sinnathurai
HTML
<script src="https://code.angularjs.org/1.3.1/angular.js"></script>
<div ng-app="postCtrl">
<div ng-controller="postController as vm">
<table class="table table-bordered table-striped" >
<thead>
<tr>
<th>_id</th>
<th>Title</th>
<th>Body</th>
<th class="col-sm-2"></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="post in vm.posts">
<td>{{ post.id }}</td>
<td>{{ post.title }}</td>
<td>{{ post.body }}</td>
<td class="col-sm-2">
<a ng-href="/about/{{ post._id }}" class="btn btn-danger">Edit</a>
<!-- ============================
DELETE BUTTON THAT IS NOT WORKING
--> =============================
<a ng-href="#" ng-click="vm.deletePost(post._id)" class="btn btn-primary">Delete</a>
</td>
</tr>
</tbody>
</table> Me!
</div>
</div>
JavaScript
debugger;
angular.module('postCtrl', [])
.controller('postController', function() {
var vm = this;
// bind the posts that come back to vm.posts
vm.posts =
[
{
"id" : 1,
"title" : "John",
"body" : "[email protected]"
},
{
"id" : 2,
"title" : "Watson",
"body" : "[email protected]"
},
{
"id" : 3,
"title" : "jack",
"body" : "[email protected]"
},
{
"id" : 4,
"title" : "Jim",
"body" : "[email protected]"
},
{
"id" : 5,
"title" : "Rose",
"body" : "[email protected]"
}
];
// =============================
// FUNCTION I ATTEMPTING TO CALL
// ==============================
vm.deletePost=function(){ alert("called")}
});