【问题标题】:angularjs default select always changesangularjs默认选择总是改变
【发布时间】:2015-08-23 18:34:30
【问题描述】:

使用angularjs 选择选项卡和ng-options,我选择了一个后无法获得正确的默认selecedValue

html

<select ng-model="selectedStyle" ng-options="style as style.name for style in styles"></select>

javascript

 $scope.$on('openStyleList', function (event, page) {


                styleListService.Get().
                then(function (data) {
                    var tempArray = new Array();
                    if(page.pageType == 'Jacket')
                    {
                        tempArray.push(_.first(data))
                        $scope.styles = tempArray;
                        alert($scope.styles[0].name)//here i get the first one
                        $scope.selectedStyle = $scope.styles[0];//but here the $scope.selectedStyle is not always the first one! It's always the one that I selected before.I cannot set it to the default one($scope.styles[0])
                    }
                    else if (page.pageType == 'Body') {
                        if (_.rest(data).length == 1) {
                            tempArray.push(_.rest(data))
                            $scope.styles = tempArray;
                        }
                        else {
                            $scope.styles = _.rest(data);
                        }
                        alert($scope.styles[0].name)//aslo here
                        $scope.selectedStyle = $scope.styles[0];//aslo here
                    }

                });

            })

styleListService 代码:

angular.module('editorApp')
  .service('styleListService', ['$http', '$log', '$q', '$timeout', '$window', 'baseService', 'settings',
      function styleListService($http, $log, $q, $timeout, $window, baseService, settings) {

          var StyleListServiceFactory = {};

          var _get = function () {

              return baseService.get('styles/');

          }
          StyleListServiceFactory.Get = _get

          return StyleListServiceFactory;
  }]);

baseService代码部分:

var _get = function (apiPath, responsetype) {

    var deferred = $q.defer();

    if (responsetype == undefined)
    {
        responsetype = "";
    }

    $http.defaults.cache = false;

    $http.get(settings.baseUrl + apiPath,
        {
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            responseType: responsetype

        }).success(function (response) {

            deferred.resolve(response);

        }).error(function (data, status, headers, config) {

            deferred.reject(status);

        });

    return deferred.promise;
}

baseServiceBaseFactory.get = _get;

【问题讨论】:

  • 能否把Styles数组的结构贴出来??
  • 是的。样式数组是这样的:{ "name": "12345", "pageType": "Jacket", "pageTemplateVariationID": 1}@shreya
  • 似乎您需要使用$apply$timeout 来启动摘要周期,然后更改值以将其应用于查看。无论如何,你能提供styleListService.Get吗?我猜它返回$http
  • @Grundy 是的,你是对的,我在 Get 方法中使用了 $http。我已经更新了上面的代码。但是在这种情况下我该怎么办?
  • 旁注$http已经返回promise,所以你不需要自己创建

标签: javascript angularjs select


【解决方案1】:

1) Select your default value as model
you can do this like

<select tabindex="2" class="dropdown-control " id="drpSystemDeliveryCos" ng-model="selecedValue ">
                                                            <option ng-repeat="style in styles" value="{{style .ID}}">{{style .name}}</option>
                                                        </select>

OR
    <select tabindex="6" class="form-control" id="drpOrderType1" ng-options="style.ID as style.name for style in styles " ng-model="selecedValue" ></select>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-10-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-03-25
    • 1970-01-01
    • 1970-01-01
    • 2016-04-15
    相关资源
    最近更新 更多