<html ng-app="MyApp">
<head>
<title>Angularjs</title>
</head>
<body ng-controller="MyController">
<div ng-repeat="category in categories" >
<a href="#" ng-click="setCurrentCategory(category)" >{{category.name}} </a>
</div>
</br>
</br>
<div ng-repeat="bookmark in bookmarks | filter:{category:currentCategory.name} ">
<button type="button" class="editing_buttom" ng-click="startEditing();" >
Edit
</button>
<h1>{{bookmark.title}}</h1>
</div>
</hr>
<!-- Creating -->
<div ng-if="shouldShowCreating()">
<button type="button" class="abcd1" ng-click="startCreating();"> Create a Bookmark </button>
<form class="create-form" ng-show="isCreating" ng-submit="createBookmark(newBookmark)">
<div class="form-group">
<label for="newBookmarkTitle">Bookmark Title</label>
<input type="text" ng-model="newBookmark.title" id="newBookmarkTitle" placeholder="Enter Title">
</div>
<button type="submit">Create </button>
<button type="button" ng-click="cancelCreating()">Cancel</button>
</form>
</div>
<!-- Editing-->
<div ng-if="shouldShowEditing()">
Edit a Bookmark.
<button type="button" class="btn btn-cancel" ng-click="cancelEditing();">Cancel</button>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<script src="C:\Users\relhana\Angularjs\app.js"></script>
</body>
</html>
这是我的Angularjs脚本
angular.module("MyApp",[])
.controller("MyController",function($scope){
$scope.categories=[{"id":0, "name":'Akshay'},{"id":1,"name":'Ankush'},{"id":2,"name":'Aditya'}];
$scope.bookmarks=[{"id":0, "title":'Hello Sir', "category":"Ankush"},{"id":1, "title":"Hello Mam", "category":"Aditya"},{"id":2, "title":"ABC Employee", "category":"Akshay"},
{"id":3, "title":"Intern", "category":"Akshay"}];
$scope.currentCategory=null;
function setCurrentCategory(category){
$scope.currentCategory=category;
cancelCreating();
cancelEditing();
}
$scope.setCurrentCategory=setCurrentCategory;
$scope.isCreating=false;
$scope.isEditing=false;
function resetCreateform(){
$scope.newBookmark={
title:'',
category:$scope.currentCategory
}
}
function createBookmark(bookmark){
bookmark.id=$scope.bookmarks.length;
$scope.bookmarks.push(bookmark);
resetCreateform();
}
$scope.createBookmark= createBookmark;
function shouldShowCreating(){
return $scope.currentCategory && !$scope.isEditing;
}
function shouldShowEditing(){
return $scope.isEditing && !$scope.isCreating;
}
function startCreating(){
$scope.isCreating=true;
$scope.isEditing=false;
resetCreateform();
}
function cancelCreating(){
$scope.isCreating=false;
}
function startEditing(){
$scope.isEditing=true;
$scope.isCreating=false;
}
function cancelEditing(){
$scope.isEditing=false;
}
$scope.startCreating= startCreating;
$scope.cancelCreating= cancelCreating;
$scope.startEditing=startEditing;
$scope.cancelEditing=cancelEditing;
$scope.shouldShowCreating=shouldShowCreating;
$scope.shouldShowEditing=shouldShowEditing;
});
问题是:我正在创建一个新书签,提交后,新书签没有显示。请帮忙。我已从表格中取得标题,并且在提交新书标记后不会显示。