angularjs-directive

问题 I have this code in my directive compile: function compile (tElement, tAttributes, transcludeFn) { if (tAttributes.drag == 'false') { tElement.find('.myclass').removeAttr('draggable'); } //attrs.$set('ngModel', 'new value'); return { pre: function preLink (scope, element, attributes, controller, transcludeFn) { // Pre-link code goes here }, post: function postLink (scope, element, attributes, controller, transcludeFn) { This works fine But i want to add attribute instead of remove attribute

问题 folks! I have used AngularJS for a while and decided to put up a component system using directives with transclusion. One day I encountered a problem I was unable to overcome. The problem has to do with my directive, most likely. In order to understand what the problem is, I will briefly go through the basic idea, how "the system" is supposed to operate. Structure I have a directory dedicated for components: For each component, I have HTML markup and CSS file in the components directory as

问题 I have a controller that displays images via a template that is passed through ng-view and runs smoothly. I also have dropzone up and running and working smoothly. However, as soon as I add dropzone to the template the dropzone is no longer active. It displays (the zone isn't clickable unless I manually add dz-clickable, but still does nothing). I could add the dropzone in a ng-include above the area and have it hidden when the template is looking elsewhere but have heard that ng-include uses

问题 I have a tabbed navigtion in my webapp that looks like this Now I want to Change the directive each time the user clicks on one of the Navigation points. My Idea was to init the page with the first template. $scope.currentDirective = $compile('<div order-Sale></div>'); Then when the user clicks on a tab, I wanted to change and compile the content again with a new directive in it. But for some reason this is not working. How would you proceed in order to archive this dynamic content loading? I

问题 I want to create some kind of template with angularjs that uses custom directives and then according to the attributes of these directives it creates input fields, for example if you have this directive in the template : <cms:input type='text' size='14' default='this is a text' label='Content Header' ></cms:input> <cms:input type='textarea' size='50' default='this is a text area' label='Content Paragraph' ></cms:input> and this is the code of the directive app.directive('cmsInput', function()

问题 Using Angular I created a directive like this: angular .module('my-module', []) .directive('myDirective', function () { return { restrict: 'E', templateUrl: currentScriptPath.replace('.js', '.html'), scope: { scenarios: '=' }, controller: MyDirectiveController, controllerAs: 'vm', bindToController: true, replace: true } }); MyDirectiveController : MyDirectiveController.$inject = ['$scope']; function MyDirectiveController($scope) { var vm = this; vm.scenarios = $scope.scenarios; } My directive

问题 Please see the JSFiddle here which shows my issue: http://jsfiddle.net/mlippy/zkH7S/ I'm attempting to shuffle divs up and down a list with those divs moving up hiding the divs moving down. If you look at the fiddle, there are 5 different colored boxes that you can click to tell them to move to the top. If you click various boxes in various positions, you'll start to see the z-index of the boxes moving up not be higher than that of the boxes moving down. If you click the 3rd positioned box

问题 I am writing my own chat interface, to help me better understand angularJs and socket.io. My chat window is fixed, with overflow set to auto. I am using the following directive to manipulate the DOM to scroll, so that as each message is pushed onto the model array, it will be visible at the bottom of the window. app.directive('plnkScroll', [function () { return { restrict: 'A', link: function (scope, element, attrs) { angular.element(element)[0].scrollIntoView(); } }; }]); In theory, this

问题 I'm new to angular, so forgive me if I missed anything or misunderstand the docs. I have a directive, which converts the element to jquery plugin .directive('myDir', function($compile) { return { link: function(scope, element, attributes) { // $('.someDiv').jqueryPlugin(...); element.jqueryPlugin(); var el = $compile("<span translate>{{ 'label' }}</span>")(scope); element.find('.label').html(el); } } }) as you can see, first I create a jquery plugin in html element (it creates its dom inside

问题 I'm essentially trying to recreate ng-change but add some delay in it (auto-save on change frequency timeout). So far, I have the following directive: myApp.directive('changeDelay', ['$timeout', function ($timeout) { return { restrict: 'A', require: 'ngModel', scope: { callBack: '=changeDelay' }, link: function (scope, elem, attrs, ngModel) { var firstRun = true; scope.timeoutHandle = null; scope.$watch(function () { return ngModel.$modelValue; }, function (nv, ov) { console.log(firstRun); if