Javascript AngularJs在一个文件范围内有多个同名控制器
在开始的时候,我会说我是一个角度的初学者,我正在学习它。我计划创建图库系统,用户可以在其中创建多个图库。 我使用的是http.get parital指令编译并创建用于放置图像的表单。对于一个表单,它工作得很好,但当我添加更多表单时,我的函数会执行多文件时间。我认为我的逻辑不好,或者我做了坏事。这是我的指示Javascript AngularJs在一个文件范围内有多个同名控制器,javascript,angularjs,ng-file-upload,Javascript,Angularjs,Ng File Upload,在开始的时候,我会说我是一个角度的初学者,我正在学习它。我计划创建图库系统,用户可以在其中创建多个图库。 我使用的是http.get parital指令编译并创建用于放置图像的表单。对于一个表单,它工作得很好,但当我添加更多表单时,我的函数会执行多文件时间。我认为我的逻辑不好,或者我做了坏事。这是我的指示 directive("contentControl",function($http,$compile){ return { template: 'Click here'
directive("contentControl",function($http,$compile){
return {
template: 'Click here',
link: function(scope, element, attrs) {
element.bind("click", function () {
$http.get("/js/angular/File/view/admin/FileUpload.html").then(function(resp) {
var html = resp.data;
var templateGoesHere = angular.element(document.getElementById('templateGoesHere'));
templateGoesHere.append(html);
$compile(templateGoesHere)(scope);
});
});
},
}
模板
<div ng-controller="FileController">
<button ng-click="upload(files)"></button>
<form name="myForm">
<div ngf-drop="add($files)" ng-model="files" class="drop-box clearfix"
ngf-drag-over-class="dragover" ngf-multiple="true">
<div ng-repeat="image in images">
<div class="col-sm-3">
<img ngf-thumbnail="!image.file.$error && image.file"
ngf-size="{width: 5024, height:200, quality: 0.9}"
class="img-responsive">
</div>
</div>
</div>
</form>
</div>
我正在寻找隔离数据,或者有人可以向我解释创建多文件库的更好逻辑这是正常的,因为每次使用该指令时都会生成一个新的http.get
ngInclude
和ngIf
包含模板
<a href="#" ng-click="showMyTemplate()">Click here</a>
<div ng-if="showTmp">
<div ng-include="template.html"/>
</div>
我使用多文件http get,因为我考虑过1个gallery 1表单,但现在考虑的是添加选择将更改gallery数据的内容,这将是一个表单并选择更改数据。
<a href="#" ng-click="showMyTemplate()">Click here</a>
<div ng-if="showTmp">
<div ng-include="template.html"/>
</div>
// init
$scope.showTmp = false;
$scope.showMytemplate = function(){
$scope.showTmp = true;
}