【问题标题】:Angularjs material or angularjs store multiple select dropdown data in webserviceAngularjs材料或angularjs在webservice中存储多个选择下拉数据
【发布时间】:2015-10-03 05:15:39
【问题描述】:

我正在使用 Angular 材料,我被困在多选下拉列表中,我选择了多个选项,并且在 ng-change 上我正在调用函数,它将获取每个选项的 id,我将比较 API id,但是当我选择它将在功能中提供数据,例如 在第一个选项选择中 123456 在第二个选项选择中 123456,456231

在第三个选项选择中 123456,456231,471258

所以每当我进行比较时,它只进入条件一次,即使我尝试拆分也不会更多,它给出错误并且什么都不做。

<md-select ng-model="$parent.follower" placeholder="Select Person" multiple="true" ng-change="getFollowers(follower)">             
     <md-option ng-repeat="follower in followers" value="{{follower.id}}"> {{follower.full_name}}</md-option>
   </md-select>

所以让我知道如何处理这种情况,如果有人有经验并且非常好,请告诉我。

谢谢 希瓦姆

【问题讨论】:

  • 你能提供 plunker 或 fiddle,这样问题就容易理解了
  • ng-change 调用函数和该函数提供选项的 id 假设我选择 apple ,它将提供 123 id 然后我选择第二个选项然后控制台显示 123,456 与其余所有内容相同。
  • 好的,如果你在数组中获取 id,那么接下来你想做什么?
  • 好的,让我给纯 angularjs 多选,可以发布在 web 服务上,拜托
  • 不,不是像 123,4565 这样简单的数组,如果我选择单个选项然后 123 ,然后再次选择两个选项然后 1223,456 在函数中

标签: javascript angularjs web-services angularjs-ng-repeat angular-material


【解决方案1】:

我为您创建了 Codepen,您可以在其中看到每次更改的值 因为我不知道你的数据格式,所以我使用了一个演示版

HTML

<div ng-controller="AppCtrl as ctrl" class="md-padding selectdemoBasicUsage" ng-app="MyApp">
  <div>
    <h1 class="md-title">Enter an address</h1>
    <div layout="row">
      <md-input-container>
        <label>Street Name</label>
        <input type="text">
      </md-input-container>
      <md-input-container>
        <label>City</label>
        <input type="text">
      </md-input-container>
      <md-select placeholder="State" ng-model="ctrl.userState" multiple="true" ng-change='changeValue(ctrl.userState)'>
        <md-option ng-repeat="state in ctrl.states" value="{{state.abbrev}}">{{state.abbrev}}</md-option>
      </md-select>
    </div>
  </div>
</div>

Angularjs 代码

      'use strict';
      angular
          .module('MyApp')
          .controller('AppCtrl', function($scope,$http) {
            this.userState = '';
            this.states = ('AL AK AZ AR CA CO CT DE FL GA HI ID IL IN IA KS KY LA ME MD MA MI MN MS ' +
                'MO MT NE NV NH NJ NM NY NC ND OH OK OR PA RI SC SD TN TX UT VT VA WA WV WI ' +
                'WY').split(' ').map(function (state) { return { abbrev: state }; });
     $scope.changeValue=function(value){
        console.log(value);
     $http.post(//url).then(function(response){
//handle response here
     });
  }    
  });

用于工作解决方案的 Codepen http://codepen.io/anon/pen/WvygLZ

【讨论】:

  • 好的,假设我想将数据存储在 web 服务中,例如 -- "followers":[{"id":"123","name":"John Sina"}] 那么如何发送它们,我正在尝试喜欢数据:{ Followers[id]== data } 但不工作
  • followers[0].id === data 将解决您的问题,因为对象在数组内
  • w3schools.com/json/tryit.asp?filename=tryjson_objectarray_4 看看这里,假设我想添加一个或多个名字和姓氏,所以使用 $http 我将如何存储,通常我使用像 data:{field_name : datasss} 这样的格式但是正如我上面提到的 (followers":[{"id":"123","name":"John Sina"}] ) 的评论,所以你有没有 sysntax 来存储数据,请告诉我。跨度>
  • 每次存储,都会运行正确的followers[0].id ===data ?
  • 你可以发送完整的数组,你可以检查像 aangular.forEach(followers,function(follower){ if(follower.id===data){//value} });
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-04-28
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多