设置选定值AngularJS选择 [英] Setting up selected values for AngularJS select

问题描述

修改 - 我已经更新了我的什么，我希望做更多的简化版quetion，但我会保留原来的版本以及..（保持一致的答案。）

我还算是初学者 AngularJS ，并试图将数据绑定到当前时遇到问题，我的选择标签

我想要做什么。

• 用户点击修改链接


• 现有对象加载到页面（通过后端 API ）


• 对象的值应选在drpodown

以下是我的code

  #in HTML页面
＆LT;选择NG模型=FormData.name
    NG-选项=n.name在名称N
    类=的形式控制输入-LG无边框半径要求＆GT;
＆LT; /选择＆GT;#in我的服务，我已经定义了`names`阵列
名称：[{名称：'超人'，VAL：'1'}，{名称：'蝙蝠侠'，VAL：'2'}]＃这个是我在最初的形式加载办
$ scope.name =＆LT;服务名称＆gt; .names;
$ scope.FormData.name = $ scope.names [0];
 

所以我保存值 1 或 2 在数据库中，并得到它回来。如果 GET 请求成功，我

$ scope.FormData =数据; #DATA是对象形成服务器

所以，问题是，我这样做的时候，所有的值的形式正确地设置除外
选择标记

如何设置选定值我取决于服务器的要求选择标签。

新的简化我的问题的版本

  VAR名= [{名称：'超人'，VAL：'1'}，{名称：'蝙蝠侠'，VAL：'2'}];
$ scope.names =名称;
$ scope.FormData = {};
$ scope.FormData.name = $ scope.names [1];
 

在下面的阵列，而不是通过索引选择项目，如何选择通过名称或数值的项目，像

  $ scope.FormData.name = $ scope.names ['2']; #will选择{名称：'蝙蝠侠'，VAL：'2'}
 

解决方案

根据问题的新的简化版本答案：
 低于code可用于基于名称初始化下拉

  VAR名= [{名称：'超人'，VAL：'1'}，{名称：'蝙蝠侠'，VAL：'2'}];
$ scope.names =名称;
$ scope.FormData = {};
/ *通过阵列迭代和寻找基于姓名字段*所​​需的对象/
VAR isSuccess = FALSE; //变量prevent一次比赛迭代发现
angular.forEach（名称，功能（名称）{
 如果（isSuccess＆安培;！＆安培; name.name ==='蝙蝠侠'）{
  $ scope.FormData.name =名称;
  isSuccess =真;
}
}）;
};
 

请检查是否这有助于！

EDIT - I have updated my quetion with more simplified version of what I want to do, but I will keep the original version as well.. (to keep the answers align..)

I'm fairly a beginner for AngularJS and currently having problems when trying to bind data to my select tag

What I want to do

• user clicks the edit link
• existing object loads to the page (via back end api)
• object value should be selected in the drpodown

Following is my code

#in the HTML page
<select ng-model="FormData.name"
    ng-options="n.name for n in names"
    class="form-control input-lg no-border-radius" required>
</select>

#in my service I have defined the `names` array
names: [{name: 'Superman', val: '1'}, {name: 'Batman', val: '2'}]

#this is what I do in initial form loading
$scope.name = <service name>.names;
$scope.FormData.name = $scope.names[0];

So I save the value 1 or 2 in the DB and getting it back. If the GET request is successful, I do

$scope.FormData = data; #data is the object form the server

So the problem is, when I do this, all the values are setting in the form correctly except select tags

How can I set selected values for my select tags depending on the server request.

New simplified version of my question

var names= [{name: 'Superman', val: '1'}, {name: 'Batman', val: '2'}];
$scope.names =names;
$scope.FormData = {};
$scope.FormData.name = $scope.names[1];

In the following array, instead of selecting the item by index, how can I select the item by name or the value, like

$scope.FormData.name = $scope.names['2']; #will select the {name: 'Batman', val: '2'}

解决方案

Answer based on the new simplified version of the question : Below code can be used to initialise the dropdown based on name

var names= [{name: 'Superman', val: '1'}, {name: 'Batman', val: '2'}];
$scope.names =names;
$scope.FormData = {};
/*Iterating through the array and finding the required object based on the 'name' field*/
var isSuccess = false; //variable to prevent the iteration once the match is found
angular.forEach(names, function(name){
 if(!isSuccess && name.name === 'Batman'){
  $scope.FormData.name = name;
  isSuccess = true;
}
});
};

Kindly check if this helps!

这篇关于设置选定值AngularJS选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！