选择角+：选定值 [英] Angular + chosen : selected values

问题描述

我有一个关于选择的部件和AngularJS的组合设定NG-模式问题（见视频：的 https://www.youtube.com/watch?v=8ozyXwLzFYs ）

I have a question about setting ng-model in combination of chosen widget and AngularJS (see this video : https://www.youtube.com/watch?v=8ozyXwLzFYs)

我想这样做的是收件人设置为某个值，这将是preselected。这里是HTML和JS这个例子（从视频）结果

What I would like to do is to set recipients to some values which would be preselected. Here is HTML and JS for this example (from the video)

<h1>Chosen</h1>
  <select data-placeholder="Choose a Recipient" multiple class="span4 chzn-select" chosen
      ng-model="recipients" ng-options="recipient.name for recipient in recipientsList">
  </select>

  <p ng-repeat="recipient in recipients"><strong>{{recipient.name}}</strong></p>

和JS的控制器结果

$scope.recipientsList = [];
    $scope.recipients = [];
    $scope.fetchRecipients = function() {
        $http.get($scope.url).then(function(result){

       $scope.recipientsList = [
    {"id":0, "name":"Recipient 0"},
    {"id":1, "name":"Recipient 1"},
    {"id":2, "name":"Recipient 2"},
    {"id":3, "name":"Recipient 3"},
    {"id":4, "name":"Recipient 4"},
    {"id":5, "name":"Recipient 5"},
    {"id":6, "name":"Recipient 6"},
    {"id":7, "name":"Recipient 7"},
    {"id":8, "name":"Recipient 8"},
    {"id":9, "name":"Recipient 9"},
    {"id":10, "name":"Recipient 10"}
];
     $scope.recipients = [{"id":0, "name":"Recipient 0"}, 
     {"id":1, "name":"Recipient 1"}];
     });
  }

    $scope.fetchRecipients();

我尝试了一些组合，但在菜单值不是preselected，尽管它们被存储在接受者，因为他们是下面的菜单显示。你可以在这里看到这样的例子：
http://jsfiddle.net/YKZSw/8/

感谢您ansers。

马捷

推荐答案

AngularJS ngOptions属性选择从数据源提供的数组中的元素。在你的情况下，recipientsList数组包含一定数目的对象。然而，以preSELECT你希望的元件不因反对不平等现象，即使它们是相似的名单present。
含义recipientsList：{ID：0，名：收件人0}不等于收件人：{ID：0，名：收件人0}（你可以试试在JS相同安慰）。角度没有找到在列表元素，因此不preSELECT

AngularJS ngOptions attribute selects an element from the array provided as data source. In your case, the recipientsList array contains certain number of objects. Yet, the elements you wish to preselect are not present in the list due to object inequality even though they are similar. Meaning recipientsList: {"id":0, "name":"Recipient 0"} is not equal to recipients:{"id":0, "name":"Recipient 0"}(You can try the same in the JS console). Angular does not find the element in the list and hence does not preselect.

此修改小提琴作品： http://jsfiddle.net/mananbharara/YKZSw/9/
在这种情况下，唯一的区别是在你的收件人定义：

This modified fiddle works: http://jsfiddle.net/mananbharara/YKZSw/9/ The only difference in this case is in your recipients definition:

$ scope.recipients = [$ scope.recipientsList [0]，$ scope.recipientsList [1];

在这种情况下，你有一个列表，选择的值只能来自该列表中。

In this case you have one list and selected values can come from that list only.

这种方法，你会在使用的情况下，你必须保持两个列表的替代方法是保持选择值作为基本类型。在这种情况下，原始的平等总会举行。

An alternative to this approach which you would use in case you have to maintain two lists is to keep the select value as a primitive type. In which case primitive equality would always hold.

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