如何在angular上创建有子公司的公司列表
How create list of companys who has childs company on angular?
如何添加子公司、编辑和删除列表中的公司。（和本地存储）我有一些代码要删除，但它们不起作用我不知道它该怎么锁感谢的帮助
if (!localStorage.getItem("companys")) {
localStorage.setItem("companys", JSON.stringify([]));
};
(function() {
var app = angular.module('myApp', []);
app.controller('ListController', function($scope){
this.retrieveCompanys = function() {
return JSON.parse(localStorage.getItem('companys'));
}
this.addToStorage = function(company){
this.companys.push(company);
localStorage.setItem('companys', JSON.stringify(this.companys));
}
this.companys= this.retrieveCompanys();
this.removeCompany = function (item) {
var index= this.companys.indexOf(item);
this.companys.splice(index,1);
}
$scope.add = false;
$scope.togglechild = function() {
$scope.add = !$scope.add;
};
$scope.edit = false;
$scope.toggleedit = function() {
$scope.edit = !$scope.edit;
};
====Delete company======
$scope.removeCompany = function(company) {
var index = $scope.companys.indexOf(company);
$scope.companys.splice(index,1);
}
});
======Child Company========
app.controller('AddController', function(){
this.company = { child: [] };
this.addCompany = function(list) {
list.addToStorage(this.company);
this.company = {child: [] };
};
});
app.controller('ChildController', function(){
this.child = {};
this.addChild = function(company) {
company.childs.push(this.company);
this.child = {}
}
});
})();
代码的HTML部分
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="app.css">
</head>
<body class="container" ng-controller="ListController as list">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" ng-controller = "AddController as addCtrl">
<form name="addCompanyForm" ng-submit="addCtrl.addCompany(list)" novalidate>
<h3 class="text-center">Add new company</h3>
<fieldset class="form-group">
<input class="form-control" ng-model="addCtrl.company.name_company" placeholder="Name Company" title="Name Company" ng-required>
</fieldset>
<fieldset class="form-group">
<div class="input-group">
<div class="input-group-addon">$</div>
<input class="form-control" ng-model="addCtrl.company.annual_earnings" placeholder="Annual earnings" title="Annual earnings" ng-required>
</div>
</fieldset>
<br>
<fieldset class="form-group">
<input type="submit" class="btn btn-primary pull-right" ng-click="addCompany(list)" value="Add Company">
</fieldset>
</form>
<form ng-show="add">
<h3 class="text-center">Add child company</h3>
<fieldset class="form-group">
<input class="form-control" ng-model="addCtrl.company.name_company" placeholder="Name Company" title="Name Company" ng-required>
</fieldset>
<fieldset class="form-group">
<div class="input-group">
<div class="input-group-addon">$</div>
<input class="form-control" ng-model="addCtrl.company.annual_earnings" placeholder="Annual earnings" title="Annual earnings" ng-required>
</div>
</fieldset>
<br>
<fieldset class="form-group">
<input type="submit" class="btn btn-primary pull-right" ng-click="addCompany(list)" value="Add Company">
</fieldset>
</form>
<form ng-show="edit">
<h3 class="text-center">Edit data company</h3>
<fieldset class="form-group">
<input class="form-control" ng-model="addCtrl.company.name_company" placeholder="Name Company" title="Name Company" ng-required>
</fieldset>
<fieldset class="form-group">
<div class="input-group">
<div class="input-group-addon">$</div>
<input class="form-control" ng-model="addCtrl.company.annual_earnings" placeholder="Annual earnings" title="Annual earnings" ng-required>
</div>
</fieldset>
<br>
<fieldset class="form-group">
<input type="submit" class="btn btn-primary pull-right" ng-click="addCompany(list)" value="Edit Data">
</fieldset>
</form>
</div>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8" >
<h3 class="text-center">List of Company</h3>
<table class="table">
<!--=========Table Head==============-->
<tr>
<th class="col-xs-6 col-sm-6 col-md-6 col-lg-6">Name Company</th>
<th class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">Own earnings</th>
<th class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">Total earnings</th>
<th class="col-xs-1 col-sm-2 col-md-2 col-lg-2 text-center">Edit/Delete</th>
</tr>
<!--===================MAIN COMPANY=====================-->
<tr ng-repeat="company in list.companys track by $index">
<td class="col-xs-6 col-sm-6 col-md-6 col-lg-5 text-center">
<a href="#{{'demo'+$index}}" data-toggle="collapse">List</a>
<b>{{company.name_company}}</b>
</td>
<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">
{{company.annual_earnings + "$"}}
</td>
<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">
</td>
<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">
<a ng-click="toggleedit()" title="Edit Data">Edit</a> | 
<a ng-click="removeCompany(company)" title="Delete"><b>x</b></a> | 
<a ng-click="togglechild()" title="Add Child Company"><b>+</b></a>
</td>
<tr id="{{'demo'+$index}}" class="collapse">
<td>{{}}</td>
<td>{{}}</td>
<td>{{}}</td>
<td>{{}}</td>
</tr>
</tr>
</table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript" src="app.js"></script>
</body>
</html>
您的公司模型应该具有属性Id、parent_company_Id、company_name和manual_earning。因此，母公司的parent_company_Id属性将为空。并且子公司将具有parent_company_Id的值。您可以提供创建子公司的下拉列表来选择父公司。
相关文章：
- 如何通过javascript在我的公司域上发送电子邮件
- 我如何创建一个动态地图来显示我们公司的位置
- 如何让公司内的其他人可以访问本地主机
- 多数据库公司的推动者
- "开始跟随一家公司”;使用LinkedIn API
- Linkedin是否为公司搜索提供JavaScript API
- 如何在angular上创建有子公司的公司列表
- 太平洋投资管理公司:成功登录管理员后获得死亡白屏
- Google共享联系人API更新公司范围内的联系人目录
- LinkedIn关注显示空白页的公司按钮
- PHP preg_replace 到 JavaScript |英国广播公司
- 尝试从“平面”JSON连接D3节点以制作公司层次结构图
- 当我从下拉列表中选择公司名称时，UpdatePanel 自动发布返回=true 并且自动完成文本框不起作用
- 将公司名称绑定到更新面板中的下拉列表，自动完成文本框工作，但每次页面刷新时
- 如何使用PHP / CURL / Javascript等从 mca.gov.in 获取公司详细信息
- 我可以将我的经纪公司的API与Javascript而不是C#一起使用吗?
- 在公司网络中分发表格的 Google Apps 脚本
- Jquery javascript 股票报价器如何获取公司名称
- 我如何控制这个亚马逊附属公司JavaScript片段的宽度
- 领英api-获取公司更新
