Bài đăng nổi bật

 AngularJS CRUD Modal Bootstrap 


Kiến trúc code 



Video demo 


Khung trang index.html 


Toàn nội dung trang index.html 








Code CSS style.css

.btn-group-sm>.btn, .btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
line-height: 1.5;
border-radius: 1.0rem;
}
.btn-info {
color: #d0eaf5;
background-color: #6286ea;
border-color: #ced4da;
}

Code Javascript app.js 

// Code goes here

var app = angular.module("myApp", []);

app.controller("myCtrl", function($scope){
console.log("My controller.....");


$scope.users = [
{name: "Thi", email: "dangkimthi@gmail.com", fullname: "Dang Kim Thi"},
{name: "ThiDK", email: "thidk@gmail.com", fullname: "Thi DK"},
{name: "CodeLean", email: "codelean@gmail.com", fullname: "Code Lean"}
];

$scope.addUser = function(){
$scope.users.push($scope.newUser);
$scope.newUser = {};
$scope.message = "New User Added successfully";
};

$scope.selectUser = function(user){
console.log(user);
$scope.clickedUser = user;
};

$scope.editUser = function(){
$scope.message = "User Edited successfully";
};

$scope.deleteUser = function(){
$scope.users.splice($scope.users.indexOf($scope.clickedUser));
$scope.message = "User Deleted successfully";
};

$scope.clearMessage = function(){
$scope.message = "";
};

});

Post a Comment

أحدث أقدم