angularjs-directive

问题 HTML: <div ng-app="my-app" ng-controller="AppController"> <ng-form name="myform"> <gtux-el></gtux-el> </ng-form> </div> JS var app = angular.module('my-app', [], function () { }) app.controller('AppController', function ($scope) { }) app.directive('gtInputMsg', ['$compile', '$interpolate', '$log', function($compile, $interpolate, $log) { function link($scope, element, attrs, ctrls) { var modelCtrl = ctrls[0], formCtrl = ctrls[1], msgCtrl = ctrls[2]; element.on('click', function() { console

问题 I need to have access to model created by directive and in the same time I need to get attrs in the directive. JS: module.directive('createControl', function($compile, $timeout){ return { scope: { name: '=Name' // Dynamically created ng-model in the directive element }, link: function(scope, element, attrs){ attrs.$observe('createControl', function(){ attrs.createControl //is empty if scope is an object, otherwise it is passed from html attribute } } HTML: <div class="control-group" ng-repeat

问题 You can test it in this jsFiddle: HERE (better is to see on new jsFiddle, see EDIT part of this post) I think there is a bug in AngularJS or at least not an expected result. If i detach a form then re-append it, it's class ng-invalid switch to ng-valid on re-append it to the DOM. This has for consequence to enable the submit button of the form even data aren't valid. Of course, i was expecting that validity status didn't switch. I think it's a angular bug, but maybe a jquery one. I could use

问题 I am trying to use AngularJS to provide a toggable dropdown list, where the selection of various options will trigger different lists. ng-switch seemed like the right way to do it, but my ng-model is not binding while inside the ng-switch . The binding works fine if I do not use ng-switch , but I do not know how to toggle my dropdown lists if that's the case. What could be the issue here? jsFiddle: http://jsfiddle.net/tanweihao88/LUzXT/3/ HTML: <select ng-model="periodRangeModel" ng-options=

问题 I tried to find some good examples on best practice in moving $watch functions from a controller to a factory, for example. What I have found is that actually there isn't a unanimous opinion on what's best to do. I've seen examples of injection the $rootScope into a factory and $watch ing for value changes there. Another suggestion is to avoid them whenever possible, and to use ngChange instead on the element itself, for example: <div ng-model="foo.bar" ng-change="updateValue(foo.bar)"></div>

问题 app.directive('shuffleBlocks', function($timeout){ return { link: function(sco,ele,att){ if (itemCnt <= 1) return; /*Trigger function*/ function triggerEvent(){ ... } ele.bind('click', triggerEvent); setInterval(triggerEvent, 5000); } } }) here I wrote the test var elem = '<div shuffle-blocks><div>'; elem = mockCompile(elem)(rootScope.$new()); setInterval(function(){ expect(......).toBe(....) }); Obviously this is not the right method, does anyone know how to test $timeout and setInterval in

问题 When a user tries to click browser back button and dere is dirty data on the form, it shows a confirmation. Here is the angular js controller code function MyCtrl2($rootScope, $location, $scope) { $rootScope.$watch(function () { return $location.path(); }, function (newValue, oldValue) { if ($scope.myForm.$dirty) { var a = confirm('do you'); if (!a) { //how to prevent this redirect } } }, true); } MyCtrl2.$inject = ['$rootScope', '$location', '$scope']; But how to prevent the redirect on 回答1:

问题 In my form, I would like to set form controls as untouched when the user focuses on them in order to hide the validation messages which are displayed when the field is touched and invalid. How can I do this? I have tried writing a directive but have been unable to get it to work. I can see in the console that the value in the directive is changing from true to false but the form control doesn't update. HTML: <form name="userForm" ng-submit="submitForm(userForm.$valid)" novalidate=""> <div

问题 Wondering if someone can explain the current behavior. I have one directive with isolate scope, call it dirA. I then put another directive on it, dirB. Expecting the second directive to get each scope that the isolate directive creates. dirB gets the controller scope. Why would it not get the same isolate scope that dirA is creating for that element? Thanks for any help. I don't really have any code for this, just curious. If anyone needs two little directives and some html to help visualize

问题 I want to load different templates for different screen sizes in a particular view. Markup : <div id="phoneMetaDiv" class="visible-xs"><!-- Visible on phones --></div> <div id="tabletMetaDiv" class="visible-sm"><!-- Visible on tablets --></div> <div id="desktopMetaDiv" class="visible-md"><!-- Visible on desktops --></div> <div id="giantScrMetaDiv" class="visible-lg"><!-- Visible on giant screens --></div> App script: app.run(function ($rootScope) { $rootScope.Views = { Phone : 1, //0001