在两个不同的控制器中使用相同的angularjs指令 [英] Use same angularjs directive in two different controller
本文介绍了在两个不同的控制器中使用相同的angularjs指令的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
I am uploading image using directive
angular.module("Test").directive('fileModelPhoto', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var model = $parse(attrs.fileModelPhoto);
var modelSetter = model.assign;
scope.socialPostVM.filelist = [];
element.bind('change', function () {
scope.$apply(function () {
var file = [];
file.push(element[0].files[0]);
modelSetter(scope, file);
scope.socialPostVM.fileuploaded = true;
scope.socialPostVM.attachmentmessage = "";
for (var i = 0; i < file.length; i++) {
var item = file[i];
if (item.type.indexOf('image') == 0) {
var ext = item.type;
scope.socialPostVM.filelist[i] = item;
}
else {
scope.socialPostVM.attachmentmessage = 'Please upload only image';
scope.socialPostVM.filelist = [];
scope.socialPostVM.attachment = [];
}
}
});
});
}
};
}]);
I am uploading image using directive
angular.module("Test").directive('fileModelPhoto', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var model = $parse(attrs.fileModelPhoto);
var modelSetter = model.assign;
scope.socialPostVM.filelist = [];
element.bind('change', function () {
scope.$apply(function () {
var file = [];
file.push(element[0].files[0]);
modelSetter(scope, file);
scope.socialPostVM.fileuploaded = true;
scope.socialPostVM.attachmentmessage = "";
for (var i = 0; i < file.length; i++) {
var item = file[i];
if (item.type.indexOf('image') == 0) {
var ext = item.type;
scope.socialPostVM.filelist[i] = item;
}
else {
scope.socialPostVM.attachmentmessage = 'Please upload only image';
scope.socialPostVM.filelist = [];
scope.socialPostVM.attachment = [];
}
}
});
});
}
};
}]);
In html page, i access this directive like below:(controller as socialPostVM)
<div class="types">
<span>Attach:</span>
<ul>
<li><a href="" ng-click="socialPostVM.uploadfile($event)"><img src="/content/images/camera.png" alt="">Photo</a></li>
</ul>
<div ng-show="scope.fileuploaded">
<ul>
<li ng-repeat="file in socialPostVM.filelist">
{{file.name}}
</li>
</ul>
</div>
<input type="file" id="mediaUpldCntrl" class="default_brows_flie" name="pic" accept="all" style="display:none" file-model-photo="socialPostVM.attachment">
<div class="clearfix"></div>
</div>
Now I need to use this same file upload directive in another html page. (controller as vm) How can i access this same directive in two different controller?
What I have tried:
I didn't tried anything. actually I dont know what to do.推荐答案
parse', function (
parse', function (
parse) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var model =
parse) { return { restrict: 'A', link: function (scope, element, attrs) { var model =
parse(attrs.fileModelPhoto);
var modelSetter = model.assign;
scope.socialPostVM.filelist = [];
element.bind('change', function () {
scope.
parse(attrs.fileModelPhoto); var modelSetter = model.assign; scope.socialPostVM.filelist = []; element.bind('change', function () { scope.
这篇关于在两个不同的控制器中使用相同的angularjs指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
