angularjs-directive | 易学教程

setViewValue in directive on input not updating actual visible input value

阅读更多关于 setViewValue in directive on input not updating actual visible input value

问题 I've been fighting with this for almost two days. I hope you guys can help me. Summary: I have problems setting the view value of some input fields programatically. I have a form with inputs whose values are saved before the form is removed (multiple elements and multiple forms possible, user might close a form, and reopen later). On reopening the form I want to restore the previous view values (main reason is to get back also the invalid view values which were not saved in the model). This

How to get angular ui-router's ui-sref to work, when inside a directive's template?

阅读更多关于 How to get angular ui-router's ui-sref to work, when inside a directive's template?

问题 Basically, I am trying to change/customize the behaviour of the ui.bootstrap.accordion. All is working, except for integration with ui-router. Here's the way I want to use the accordion: <accordion>  <accordion-group ui-sref="site.home.newsID_1">  <accordion-heading> News 1 </accordion-heading> <p>This is</p> </accordion-group> <accordion

AngularJS - Format Text Return From JSON To Title Case

阅读更多关于 AngularJS - Format Text Return From JSON To Title Case

问题 I have a service that retrieves data from a JSON file. Some of the data within the data is all in uppercase, for example: $scope.FootballClubs = [{ CompanyName: [MANCHESTER UNITED, LIVERPOOL FOOTBALL CLUB, CHELSEA, WIGAN UNTIED, LEICESTER CITY] }]; And in my HTML, i am simply throwing about the above: <div ng-repeat="name in FootballClubs"> {{ name.CompanyName }} </div> Which throws out: MANCHESTER UNITED LIVERPOOL FOOTBALL CLUB CHELSEA WIGAN UNTIED LEICESTER CITY What i am trying to display

AngularJS directive $destroy

阅读更多关于 AngularJS directive $destroy

问题 I have an angular app setup with ng-view . In one view, in addition to the view itself, there is also a component inside that view that is dynamically loaded. This component is a directive that essentially compiles the contents so the contents can be further hooked with other directives (which it is). The content inside that component is compiled using $compile(element.contents())(scope); . As an example: <ng-view> <viewer doc="getDocument()"> </viewer> </ng-view> angular.directive('viewer',

Passing ng-model in nested directives

阅读更多关于 Passing ng-model in nested directives

问题 I want to pass my ng-model from the 'outer-directive' to an 'inner-diretive' (which is contained in the outer-directive template). What is the correct way for doing it? HTML code: <body> <outer-directive ng-model="prop" /> </body> and directive code: angular.module('app', []).directive('outerDirective', function(){ return { template: '<inner-directive ng-model="prop" />', link: function() { ... } } }); 回答1: You can set up a bi-directional binding (see the documentation, section "Directive

How to pass HTML to angular directive?

阅读更多关于 How to pass HTML to angular directive?

问题 I am trying to create an angular directive with a template, but I also don't want to lose the HTML inside of the div. For example, here is how I would like to call my directive from HTML: <div my-dir> <div class="contents-i-want-to-keep"></div> </div> Then, there is my directive: app.directive('myDir', [ '$compile', function($compile) { return { restrict: 'E', link: function(scope, iElement, iAttrs){ // assigning things from iAttrs to scope goes here }, scope: '@', replace: false, templateUrl

AngularJS file drag and drop in directive

阅读更多关于 AngularJS file drag and drop in directive

问题 This example does pretty much what I would like to port in Angular-js: HTML5 File API. I have been trying to google some example of directives however I found old example that do massive use of DOM or are not written for Angular 1.0.4. Basically this is the pure js code: var holder = document.getElementById('holder'), state = document.getElementById('status'); if (typeof window.FileReader === 'undefined') { state.className = 'fail'; } else { state.className = 'success'; state.innerHTML =

Use of symbols '@', '&', '=' and '>' in custom directive's scope binding: AngularJS

阅读更多关于 Use of symbols '@', '&', '=' and '>' in custom directive's scope binding: AngularJS

问题 I have read a lot about the use of these symbols in the implementation of custom directives in AngularJS but the concept is still not clear to me. I mean, what does it mean if I use one of the scope values in the custom directive? var mainApp = angular.module("mainApp", []); mainApp.directive('modalView',function(){ return{ restrict:'E', scope:'@' OR scope:'&' OR scope:'=' OR scope:'>' OR scope:true } }); What exactly are we doing with the scope here? I am also not sure whether "scope:'>'"

How to get coordinates on double click on Openstreetmap?

阅读更多关于 How to get coordinates on double click on Openstreetmap?

问题 I am using angular-openlayers-directive , I want to get coordinates of the point where I double click. A similar question: Convert point to lat lon But I want to use it in angularjs. 回答1: You should check this example out: http://tombatossals.github.io/angular-openlayers-directive/examples/080-events-propagation-example.html. It shows how you can find the lat-long coordinates for mouseover. Also, here is a fiddle I made showing how you can extend it for double click: http://jsfiddle.net

$injector:modulerr when i use angular-strap?

阅读更多关于 $injector:modulerr when i use angular-strap?

问题 i'll show all my code: <!doctype html> <html lang="en" ng-app='myapp'> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="bootstrap/css/bootstrap.css"> <link rel="stylesheet" href="bootstrap/css/bootstrap-responsive.css"> </head> <body ng-controller="myCtrl"> <input type="text" ng-model="testforie"> <h1>{{testforie}}</h1> <button type="button" class="btn btn-lg btn-primary" data-placement="top-right" data-container="body" data-duration="3" bs-alert="alert"