angularjs-directive

I'm trying to spy on an $emit from a directive, but somehow I cannot get the spy to 'hear' the $emit. This is the code in my directives' controller: $scope.$on('send', function () { console.log('called'); $scope.$emit('resultSend', {'ok': true, 'data': ''}); }); This is my unit test: var $rootScope, $compile, elm, element; beforeEach(inject(function ($injector) { $rootScope = $injector.get('$rootScope'); $compile = $injector.get('$compile'); elm = angular.element('<test></test>'); element = $compile(elm)($rootScope); })); it('should listen for the send broadcast and emit the resultSend',

I'm trying to add a bootstrap DateRangePicker in the Filter Header Template for an Angular UI-Grid. I can see that the template is working properly because it shows the Bootstrap Icon. I do not want to use the native angular Type:'date'. I want to use a bootstrap date picker. I have a Plunker as an example further down, that shows the native datepicker working and the Bootstrap Datepicker button clickable but not displaying anyting. I have all the includes needed for this to show up. <!-- Include Required Prerequisites --> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery

How can I use the value of an attribute in a directive? My element looks like this: <div class="tooltip-icon" data-my-tooltip="click" data-tooltip-title="foo" data-tooltip-content="test content"></div> I would like to use that in the template of my directive, which looks like this: mainApp.directive('myTooltip', function() { // allowed event listeners var allowedListeners = ["click"]; return { restrict: 'A', template: '<div class="tooltip-title">...</div>' + '<div class="tooltip-content">' + '...</div>', link: function(scope, elm, attrs) { if(allowedListeners.indexOf(attrs.myTooltip) != -1){

I am trying to create a directive in Angular that takes a set of properties manipulates the some text and outputs it to the element. The problem i'm having is I want to have some of the text wrapped in a ng-click which is to call a function from the scope that will in the end open a dialog box. I have created a very simple example here which once working will let me expand on it: http://jsfiddle.net/BEuvE/ app.directive('parseString', function() { return { restrict: 'A', scope: { props: '=parseString' }, link: function compile(scope, element, attrs) { var nameHTML = '<a href="#" ng-click=

I have a custom directive which adds some html. myAppModule.directive('myDirective', function() { var linker = function(scope, element) { return element.html("<b>directive loaded</b>"); }; return { restrict: "E", rep1ace: true, link: linker, scope: false }; }); This directive is loaded and used in a dynamically loaded html which is included via ng-include . <script type="text/javascript" src="dynamicscript.js"></script> <my-directive>...</my-directive> But it does't work. The linker -function is never called. It works if I move the dynamicscript.js script loading from the included html to the

This is an AngularJS widget which replaces a tag with an editable text field. Clicking the text replaces it with an input field, and hitting enter on the input updates an existing resource. I am not happy with the code I produced. Are all of these evals and applys really necessary? How can I improve this? To use editable-text(model="activeCustomer.phone_number", resource="Customer", field="phone_number") The Directive Code .directive("editableText", function($injector){ return { restrict: "E", templateUrl: document.views.directivePartials.editableText, link: function(scope, elem, attrs){ $

I am trying to develop two drop downs in my Angular application. The 1st one is shop list and the other one is godown list . When I select a shop it will show it on data.but when I select Godown it's not changing data. Here I have two drop down boxes. I think my problem is in my typescript file(Onselect) because here I have 2 drop downs(in html I use 2 Onselect function but in my ts file have only one function). I'm just a beginner in Angular , so I would appreciate any comments on downsides of this method: ngOnInit() { this.Service.FetchPopulateOutlets().subscribe(outletsData => { let