What’s the meaning of require: ‘ngModel’?

[Origin]: https://stackoverflow.com/questions/20930592/whats-the-meaning-of-require-ngmodel

This is the HTML for my directive:

<textarea data-modal="modal" data-mydir ng:model="abc"></textarea>

In my directive I have this:

return {
        require: 'ngModel',
        replace: true,
        scope: {
            modal: '=modal',
            ngModel: '=',
            pid: '=pid'
        },

Can someone tell me, what’s the significance of require: ‘ngModel’ ? I see this in many different directives. Could I call this data-modal?

I am confused because when I change it to data-modal I get a message from Angular saying

Controller 'ngModel', required by directive 'textarea', can't be found!

Tried to Load Angular More Than Once

[Origin]: https://stackoverflow.com/questions/22595878/tried-to-load-angular-more-than-once

This could be a number of issues: essentially it’s a problem of routeProvider not finding a file and recursively loading the default.

For me, it turned out that it wasn’t minification but concatenation of the js that caused the problems.

angular.module('myApp').config(['$routeProvider', function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/listing.html',
        controller: 'ListingCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  }]).constant('FIREBASE_URL', 'something');

You’ll notice that if the app can’t find a file (i.e., otherwise), then it will redirect to the root, which in this case loads the templateUrl. But if your templateUrl is wrong, then it will cause a recursion that reloads index.html loading angular (and everything else) over and over.

In my case, grunt-concat caused the templateUrl to be wrong after build, but not before.

I had the same issue, The problem was the conflict between JQuery and Angular. Angular couldn’t set the full JQuery library for itself. As JQLite is enough in most cases, I included Angular first in my web page and then I loaded Jquery. The error was gone then.

How to remove currency symbol in AngularJS

[Origin]: https://stackoverflow.com/questions/31174600/how-to-remove-currency-symbol-in-angularjs

Can anybody tell how to remove the currency symbol in AngularJS?

value = $filter('currency')(value);

I am getting a dollar symbol. I want to remove it.

Just pass empty string as second argument to the filter function.

value = $filter('currency')(value, "");

Also you can inject currencyFilter itself. You do not have to derive it from the filter Factory, with that you would just do:

value = currencyFilter(value, "");

Note the syntax:

$filter('currency')(amount, symbol, fractionSize)

ARIA: Attribute ” aria-label “, required for accessibility, is missing on node

[Origin]: https://github.com/textAngular/textAngular/issues/1446

when using with angular material it shows the warning about aria label
ARIA: Attribute " aria-label ", required for accessibility, is missing on node:

<textarea id="taHtmlElement8316965102261715" ng-show="showHtml" ta-bind="ta-bind" ng-model="html" class="ng-pristine ng-untouched ng-valid ng-scope md-input ta-bind ta-html ta-editor form-control ng-empty ng-hide" rows="1" aria-hidden="true" aria-invalid="false" style="height: 0px;"></textarea>

where we have to add aria attribute in textangular directive

I Resolved this issue by adding the aria-label attribute.

aria-label="ShowHideAccountant"

if you have multiple fields and you want to ignore the issue in your application. Try to set $mdAriaProvider.disableWarnings();

app.config(function($mdAriaProvider) {
   // Globally disables all ARIA warnings.
   $mdAriaProvider.disableWarnings();
});

Solution to your problem: you have to add attribute to your input, select, Textarea tags
Example : <textarea aria-label="Your Field Lable name"></textarea>

Angular: what is filterFilter

[Origin]: https://stackoverflow.com/questions/36702123/angular-what-is-filterfilter

i am new in angular and i am bit familiar with filter word but what is filterFilter word and usage in angular. just come across a code below from this url https://stackoverflow.com/a/22704140/6188148.

see the code

angular.module('FilterInControllerModule', []).
    controller('FilterController', ['filterFilter', function(filterFilter) {
      this.array = [
        {name: 'Tobias'},
        {name: 'Jeff'},
        {name: 'Brian'},
        {name: 'Igor'},
        {name: 'James'},
        {name: 'Brad'}
      ];
      this.filteredArray = filterFilter(this.array, {name:'Igor'});
    }]);

just tell me what is filterFilter ? is it any built-in filter ?

Angular filter names just have to end with Filter in order to be a valid filter.

The ‘Access-Control-Allow-Origin’ header contains multiple values

[Origin]: https://stackoverflow.com/questions/37594403/the-access-control-allow-origin-header-contains-multiple-values

i’m trying to send get request to api like it’s a login url

var url = "http://demo.software.travel/gptp/api/authorization?apiKey=****&amp;alias=****&amp;login=****&amp;password=****"
$.get(url, function(data) {
    console.log(data);
});

i’m getting this in my console this error

XMLHttpRequest cannot load http://demo.software.travel/gptp/api/authorization?apiKey=****&alias=****&login=****&password=****. 
The 'Access-Control-Allow-Origin' header contains multiple values 'http://travellights.net, *', but only one is allowed. 
Origin 'http://travellights.net' is therefore not allowed access.

i’m trying to see questions here to solve it but i didn’t get what i need to change, this is annoying actually.

The ‘Access-Control-Allow-Origin’ header contains multiple values

this solved by asp.net web.congif

By the way i’m using CHROME BROWSER any help i appreciate.

UPDATE response headers:

Access-Control-Allow-Credentials:true
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:origin, x-requested-with, Content-Type, accept, Token
Access-Control-Allow-Methods:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS
Access-Control-Allow-Origin:http://travellights.net
Access-Control-Allow-Origin:*
Connection:close
Content-Encoding:gzip
Content-Type:application/json;charset=utf-8
Date:Thu, 02 Jun 2016 16:41:18 GMT
Server:nginx/1.1.19
Set-Cookie:JSESSIONID=51FEE1A1206B9B481DD3EEA4167A9256; Path=/gptp
Vary:Origin
Vary:Accept-Encoding
X-UA-Compatible:IE=EmulateIE7

Request Headers:

Accept:application/json, text/javascript, */*; q=0.01
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8,ar;q=0.6,en-GB;q=0.4
Connection:keep-alive
Host:demo.software.travel
Origin:http://travellights.net
Referer:http://travellights.net/b2b/Pages/login?
User-Agent:Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36
shareedit

You are attempting to do Cross-origin resource sharing (CORS) which is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the resource originated. (such as accessing fonts or JSON files).

Browsers restrict your access to resources from other origins as of Same-origin policy as a security measure for internet users.

To get around this issue you have to options:

  1. allow CORS on the domain http://demo.software.travel (but there is are security concerns, more description about it here: https://www.owasp.org/index.php/HTML5_Security_Cheat_Sheet#Cross_Origin_Resource_Sharing)

Enable CORS on the server to be able to access other domains through. this can be done by adding the following headers to responses:

Access-Control-Allow-Origin: http://travellights.net Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept
  1. if you are not granted resource sharing with that domain, you are allowed to use JSONP for read only operations (JSONP is inherently read-only)

JSONP wraps a JSON object in a callback, which technically makes the request a non-restricted resource (a script tag) hence can be shared across domains.

it can be done via vanilla js by adding a script tag onto the page.

function process(data) {
    // do stuff with JSON
}

var script = document.createElement('script');
script.src = '//domainURL?callback=process'

document.getElementsByTagName('head')[0].appendChild(script);

or you can use jquery to achieve the same:

$.ajax({enter code here
    url: "http://query.yahooapis.com/v1/public/yql",
    jsonp: "callback",
    dataType: "jsonp",
    data: {
        q: "select title,abstract,url from search.news where query=\"cat\"",
        format: "json"
    },
    success: function( response ) {
        console.log( response ); // server response
    }
});

jquery documentation: https://learn.jquery.com/ajax/working-with-jsonp/

shareedit

If you set “Full” CORS (with OPTION pre-request) on in nginx by add ‘access-control-allow-origin *’ and independently you add that header (for Simple CORS – without OPTION pre-request) to each response in SERVER (eg. php):

header('Access-Control-Allow-Origin', "*");

Then you will get this problem. Solution: remove code which add this header in server if already you add this header in your nginx config 🙂

I found this advice here

shareedit