Question

我有一个选择列表框，我有一个按钮。根据按钮selectId，我必须过滤显示在选择列表框中的模型。

这里的问题是，当我单击此按钮两次时，模型才会更新。我在GetFormsClicked中有一个过滤函数，它有关于此的逻辑。

My Angular控制器如下：

(function() {
  var controllerId = 'GroupsController';

  ig.app.controller(controllerId, ['$scope', '$log', '$http', '$compile', 'fileRvwQuestSvc', 'DataSvc',
    function($scope, $log, $http, $compile, fileRvwQuestSvc, DataSvc) {

      $scope.FrequencyMap = {
        1: "Annual",
        2: "Monthly",
        3: "Half Year"
      };

      $scope.FormMap = {
        1: "CMSMISC",
        2: "CMSFPEA",
        3: "CMSPIID",
        5: "CMSMSR",
        7: "CMSCOI"
      }

      $scope.GetAllGroupForms = function(Id) {
        var url = '/GroupForm/Details/' + Id;
        $scope.loading = true;
        DataSvc.getAjaxData(url)
          .then(function(data) {
            //success        
            $scope.GroupForm = data.data;
            $scope.GroupFormBack = data.data;
            $scope.loading = false;
          }, function(httpStatus) {
            //failed
            $scope.hasErrors = true;
            if (httpStatus === 404) {
              $scope.errorMessage = "Couldn't retrieve Users Info";
            } else {
              $scope.errorMessage = 'The system could not process your request, please try again or contact the system administrator.';
            }
            $log.warn(httpStatus);
            $scope.loading = false;
          });
      };


      $scope.availableFormsTestOriginal = [

        {
          "Id": null,
          "GroupId": null,
          "FormId": 1,
          "SortOrder": null,
          "Frequency": 1,
          "IsCollapsed": false,
          "IsDeleted": false
        },
        {
          "Id": null,
          "GroupId": null,
          "FormId": 2,
          "SortOrder": null,
          "Frequency": 1,
          "IsCollapsed": false,
          "IsDeleted": false
        },
        {
          "Id": null,
          "GroupId": null,
          "FormId": 3,
          "SortOrder": null,
          "Frequency": 1,
          "IsCollapsed": false,
          "IsDeleted": false
        }

      ]


      var AddGroupForm = function() {

        $scope.loading = true;
        var url = '/GroupForm/Create/';
        DataSvc.AddFormData(url, $scope.GroupForm)
          .then(function(data) {
            //success
            $scope.loading = false;
            //$scope.successMessage = "Form Saved Successfully";
            $scope.successMessage = "GroupForm Updated Successfully";
          }, function(httpStatus) {
            //failed
            $scope.hasErrors = true;
            if (httpStatus === 404) {
              $scope.errorMessage = "Couldn't retrieve Users Info";
            } else {
              $scope.errorMessage = 'The system could not process your request, please try again or contact the system administrator.';
            }
            $log.warn(httpStatus);
            $scope.loading = false;
          });
      }

      $scope.filterailableforms = function() {
        for (i = 0; i < $scope.availableFormsTest.length; i++) {
          for (j = 0; j < $scope.GroupForm.length; j++) {
            if ($scope.availableFormsTest[i].FormId === $scope.GroupForm[j].FormId && $scope.availableFormsTest[i].Frequency === $scope.GroupForm[j].Frequency) {
              $scope.availableFormsTest.splice(i, 1);
            }
          }
        }

      }


      activate();

      $scope.GetFormsClicked = function(selectid) {
        $scope.availableFormsTest = angular.copy($scope.availableFormsTestOriginal);
        $scope.GetAllGroupForms(selectid);
        $scope.updateavailableforms(selectid);
        $scope.filterailableforms();
      }

      function activate() {
        $scope.loading = false;
        $scope.GetAllGroup();

      }


    }
  ]);
})();

我的观看代码如下：

<button ng-click="GetFormsClicked(selectedId)">Select Group <span style="color:black"></span></button>` <select size="5" multiple ng-model="available" ng-options="x as FormMap[x.FormId]+' --- '+FrequencyMap[x.Frequency] for x in availableFormsTest" style="width: 400px"></select>

我的数据代码：

ig.app.factory('DataSvc', [
'$http', '$q', '$log',
function ($http, $q, $log) {
    return {
        getAjaxData: function (CtrlUrl) {
            var deferred = $q.defer();
            var rnd = ((Math.random() * 1000000) + 1);
            $http({
                method: 'GET',
                url: CtrlUrl + "/?r=" + rnd
            })
            .then(function (data, status, headers, config) {
                deferred.resolve(data, status, headers, config);
            },
            function (data, status, headers, config) {
                $log.warn(data, status, headers(), config);
                deferred.reject(status);
            });
            return deferred.promise;
        },
        AddFormData: function (CtrlUrl, model) {
            var deferred = $q.defer();
            $http.post(CtrlUrl, model).then(function (data, status, headers, config) {
                deferred.resolve(data, status, headers, config);
            },function (data, status, headers, config) {
                $log.warn(data, status, headers(), config);
                deferred.reject(status);
            });
            return deferred.promise;
        },
        UpdateFormData: function (CtrlUrl, model) {
        var deferred = $q.defer();
        $http.post(CtrlUrl, model).then(function (data, status, headers, config) {
            deferred.resolve(data, status, headers, config);
        },function (data, status, headers, config) {
            $log.warn(data, status, headers(), config);
            deferred.reject(status);
        });
        return deferred.promise;
    }
    }
}]);

Answer 1

您的问题是由于使用1900-01-01。

规则是＆＃34;在你的ng-model＆＃34;中总是有一个点，你应该有一个ng-model="variable"和正确的obj。

原因是每个带有ng-model="obj.variable"的指令都继承了父作用域和＆＃34;变量＆＃34;您正在编辑的内容未被复制回父级。

问题是由于字符串是按值复制的。通过使用对象，所有范围都将引用相同的变量。

我的AngularJS模型仅在单击两次按钮时更新

1 个答案: