angularjs-directive

merge ngClass attributes when replace true

由 喜你入骨 提交于 2019-12-08 02:37:59
问题 Here is my directive which has replace: true set on directive definition <my-custom-tag> </my-custom-tag> this is the directive template <div data-ng-class="{'class1': condition1, 'class2': condition2}"> </div> Now if the use my directive as follows it throws up error <my-custom-tag data-ng-class="{'class3': condition3}"></my-custom-tag> The reason being, since the template also defines a data-ng-class attribute, the emitted HTML is as follows <div data-ng-class="{'class3': condition3} {

AngularJS $setViewValue() Not Responding in $parsers.push()

由 风格不统一 提交于 2019-12-08 02:27:22
问题 I have a directive. It requires ngModel , and in the link, I should be able to use modelCtrl parameter to use $setViewValue(); and $render(); in conjunction to return to change the value in my input field and update the value stored in ngModel . Unfortunately, when I pass modelCtrl into my logic function, I cannot use $setViewValue(); and $render(); , even though I pass modelCtrl to the function. (See fiddle: http://jsfiddle.net/GSTC5/1/) myApp.directive('demo', function() { return { require:

AngularJS: how to invoke event handlers and detect bindings in tests

由 时光总嘲笑我的痴心妄想 提交于 2019-12-08 02:20:23
问题 I want to write unit and e2e tests for various custom angularjs directives that add javascript event bindings to the elements they are attached to. In tests, it's easy enough to simulate click and dblclick events using jQuery methods. element("#id").click(); However, I am also binding mouseover, mouseout and contextmenu events, and haven't found a way to invoke these in e2e tests. The code below shows the approach I am taking. it('should show a context menu when the user right clicks on a

Angular scope is shared for all modules and controllers

由 ▼魔方 西西 提交于 2019-12-08 01:57:26
问题 I have a single page application, which has a root module with about 5 seperate smaller modules. var rootModule = angular.module('root', ["firstModule", "secondModule", "thirdModule"]) Each module has directives and controllers. Today I discovered that I can access other module and controller scope from all other modules and controllers. So for example this controller: thirdModule.controller('ThirdController', ['$scope', function ($scope) { alert($scope.title); } And in this controller I

How to use datepicker in AngularJS using custom directive as a class?

由 [亡魂溺海] 提交于 2019-12-08 01:12:08
问题 Below are my HTML and Javascript code which I used. HTML Code: <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> <script src="date.js"></script> </head> <body> <div ng-app="app"> <input type="text" ng-model="date" class="datepicker"></input> {{ date }} </div> </body> </html> Java Script: var datePicker = angular.module('app', []); datePicker.directive('datepicker', function () { return { restrict: 'C', require: 'ngModel', link: function

why “<ng-container> not working in ”<tr>" tag

由 自闭症网瘾萝莉.ら 提交于 2019-12-08 00:15:05
问题 Code: <table> <tr> <ng-container ng-if="false"> // here ng-container not working <td> <ng-container ng-if="false">abc</ng-container>// here ng-container working fine </td> <td><ng-container ng-if="true">xyz</ng-container></td> </ng-container> </tr> </table> OutPut: xyz here expected output is no one cell was display but in between <tr> and <td> tags <ng-container ng-if="false"> are not working. If anyone idea about this problem please get solution. 回答1: I analysis this issue in deep and i

AngularJS : How to transclude and have both isolate scope and parent scope?

由 倖福魔咒の 提交于 2019-12-07 23:59:57
问题 I have a pattern wherein many item types are "editable". This means that I have lots of templates (one for each editable item type) that expect to have unique fields, but common functions (edit, save, cancel edit, delete, etc.). These common functions lead to lots of repetition on controllers: save , edit , cancel , etc., and very repetitive error-handling. One way I looked at of dealing with this was to have each controller "decorate" itself (using a service), but it got messy as well. I

Why is angular.js not smart enough to compile DOM when adding dynamic elements?

由 Deadly 提交于 2019-12-07 23:38:44
问题 I really like how AngularJS enables custom tags/elements by allowing you to declare directives inside your app, however, when I append a custom tag dynamically, nothing happens: angular.module('myApp', []).directive('test', (($compile) -> restrict: 'E' link: (scope, element, attributes) -> $(element).html('<h1>this is a test!</h1>') )) $('body').append('<test></test>') How can I build an instance of my custom tag dynamically? 回答1: Why are you calling jquery outside of angular? Normally you

AngularJS nested directives are inserted outside their supposed parent element

由 别来无恙 提交于 2019-12-07 22:59:47
问题 I'm having trouble understanding how nested directives work with AngularJS. var app = angular.module('plunker', []); app.directive('myTable', function() { return { restrict: 'E', template: [ '<table class="table table-query" ng-show="queries.length">', '<thead>', '<tr>', '<th class="query-name">Name</th>', '<th class="query-status">Status</th>', '</tr>', '</thead>', '<tbody>', '<my-row ng-repeat="query in queries track by $index"', 'query="query">', '</my-row>', '</tbody>', '</table>', ].join

AngularJS: Alerts don't show up when multiple messages change ngModel for message

由 人盡茶涼 提交于 2019-12-07 22:07:17
问题 I have a notification service which works well for when page is loaded and Controller is loaded But when I have different buttons calling different functions, they change message, but alerts don't show up Here is a plunker for that - http://plnkr.co/edit/YioiJXNkaET6T2mexjCq?p=preview What is that I need to do to update it whenever $scope.message changes? 回答1: You could $watch the model and show the alert when it changes. http://plnkr.co/edit/fJuP9LWH4MNVV1cQs3ED?p=preview In linker function
订阅 angularjs-directive