可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

If I have an <input type="email">, and the user enters an Internationalized Domain Name, Angular (EDIT: except it's not Angular's fault - see my answer for details) automatically converts the value to punycode, which is a nice feature, but very confusing for users if the value is displayed back to them. E.g.

abc@ábc.com

becomes

abc@xn--bc-lia.com

It also causes issues when a backend is expecting the original Unicode version of the domain, and the Angular app instead sends the punycode version.

I can use e.g. punycode.js to convert it back, but is there a way to do this in Angular without involving another library - either tell Angular not to do the encoding, or get the original value subsequently?

var myApp = angular.module('myApp',[]);

function thing($scope) {
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
<p>Copy this text into the input:</p>
<p>abc@ábc.com</p>
<div ng-controller="thing">
  <input id="inp" type="email" class="form-control" ng-model="addr">
  <p>Model gets: {{addr}}</p>
</div>
</body>

回答1:

It turns out it's not Angular that's doing it, it's Chrome (Safari does not have the same behaviour, haven't tested other browsers). See for example Input type email value in Chrome with accented characters wrong

Here's an example of it happening without Angular - try this in Chrome:

function update() {
  document.getElementById('output').innerText = document.getElementById('inp').value
}

<p>Copy this text into the input:</p>
<p>abc@ábc.com</p>
<div ng-controller="thing">
  <input id="inp" type="email" onchange="update()">
  <p>Browser says: <span id="output"></span></p>
</div>

So the short answer is no, there's no way of stopping this via Angular - and currently there doesn't appear to be a way to tell Chrome not to do it either.