AngularJS NG选项增加了数据类型选项的值 [英] AngularJS ng-options adds data type to option's value

问题描述

试图使用最新版本AngularJS和NG选项来填充一个DropDownList。

Trying to use the latest version of AngularJS and ng-options to populate a dropdownlist.

问题是，它增加了数据类型和值，像这样：

Issue is that it's adding the data type as well as the value, like so:

<select class="possedetail ng-valid ng-dirty ng-valid-parse ng-touched" ng-model="Province" ng-options="p as p for p in provList">
<option value="string:ALBERTA" label="ALBERTA">ALBERTA</option>
<option value="string:BRITISH COLUMBIA" label="BRITISH COLUMBIA">BRITISH COLUMBIA</option></select>

我需要字符串：阿尔伯塔省...

I need string:Alberta'...

这是我的数据源：

$scope.provList = ["ALBERTA","BRITISH COLUMBIA","MANITOBA","NEW BRUNSWICK","NEWFOUNDLAND AND LABRADOR","NORTHWEST TERRITORIES","NOVA SCOTIA","NUNAVUT","ONTARIO","PRINCE EDWARD ISLAND","QUEBEC","SASKATCHEWAN","YUKON",];

我看了谷歌文档，在网上搜索，并试图改变我的数据源格式[{名字：亚伯}，{名字：BC}] ...

I have read the google documentation, searched the web and tried changing my data source format to [{name: "Alberta"}, {name:"BC"}]...

请帮忙，解决这个办法？

Please help, any way around this?

推荐答案

如果你正确地设计你的角的应用程序，你应该怎么在意＆LT;选项＆GT; 元素产生什么值属性分配。这是视图。该视图模型是设置在您分配给它的范围变量。

If you are properly designing your Angular app, you should not care how <option> elements are generated and what value attribute is assigned. This is the View. The ViewModel is what is set on the scope variable that you assigned to it.

在换句话说，你的榜样工程。 $ scope.Province 将等于选定全省字符串，例如ALBERTA。角做翻译给你。

In other words, your example works. $scope.Province will equal the selected province string, e.g. "ALBERTA". Angular does the translation for you.

然后，您可以将它提交给服务器，或做任何你需要它：

Then, you could submit it to your server, or do whatever you need with it:

$http.post("/some/api", {data: $scope.Province})

但是，如果你要，你可以生成＆LT;选项＆GT; s的 NG-重复。这将是效率较低，更详细的，但它的工作：

But, if you must, you could generate the <option>s with ng-repeat. It would be less efficient and more verbose, but it would work:

<select ng-model="Province">
  <option ng-repeat="p in provList" value="{{p}}">{{p}}</option>
</select>

这篇关于AngularJS NG选项增加了数据类型选项的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！