Проблема AngularJS с ng-change и выбором тега

Question

Проблема AngularJS с ng-change и выбором тега

0

У меня странная проблема, когда ng-change работает неправильно с ng-select. Я прикрепил скрипку, которая воссоздает эту проблему. При выборе любой опции по умолчанию используется опция "Этот год".

<div ng-controller="MyCtrl">
        <select ng-model="selectedRange" ng-change="dateFilter()">
          <option value="week" selected>This week</option>
          <option value="month">This month</option>
          <option value="year">This year</option>
          <option value="custom">Custom</option>
        </select>
</div>

Вышесказанное - мое мнение. И ниже функция ng-change активирует тег select.

$scope.dateFilter = function () {
  $scope.customDate = false;
  var oneWeekAgo = new Date();

  if ($scope.selectedRange == 'week') {
    $scope.searchStartDate = new Date();
    $scope.searchStartDate.setDate(oneWeekAgo.getDate() - 7);
  }
  if ($scope.selectedRange = 'month') {
    $scope.searchStartDate = new Date();
    $scope.searchStartDate.setMonth(oneWeekAgo.getMonth() - 1);
  }
  if ($scope.selectedRange = 'year') {
    $scope.searchStartDate = new Date();
    $scope.searchStartDate.setYear(oneWeekAgo.getYear() - 1);
  }

  if ($scope.selectedRange == 'custom') {
    $scope.customDate = true;
  }
}

http://jsfiddle.net/G8S32/1087/

Спасибо за помощь

Bill Huang 01 июль 2015, в 18:40

Источник

Теги:

javascript

angularjs

3 ответа

1

Вы путаете = с ==.

В вашем коде $scope.selectedRange всегда будет установлен "год", и результат выражения $scope.selectedRange = 'year' будет правдивым значением, поэтому следующий код всегда будет выполняться:

$scope.searchStartDate = new Date();
$scope.searchStartDate.setYear(oneWeekAgo.getYear() - 1);

Пожалуйста, измените = на == для блока месяца и года, затем проблема будет решена.

Tong Shen 01 июль 2015, в 13:49

1

Ваш Javascript должен выглядеть следующим образом:

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
    $scope.dateFilter = function (selectedRangeVal) {
      $scope.customDate = false;
      var oneWeekAgo = new Date();

// I would make this a switch or function called like this: dateFns[selectedRangeVal]();

      if (selectedRangeVal == 'week') {
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setDate(oneWeekAgo.getDate() - 7);
      }
      if (selectedRangeVal = 'month') {
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setMonth(oneWeekAgo.getMonth() - 1);
      }
      if (selectedRangeVal = 'year') {
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setYear(oneWeekAgo.getYear() - 1);
      }

      if (selectedRangeVal == 'custom') {
        $scope.customDate = true;
      }
    }
}

И ваша разметка остается практически такой же, решение было путем добавления {{selectedRange}} и передачи ее в контроллеры dateFilter (выбор)

<div ng-controller="MyCtrl">
            <select class="atom-offerFilter--filterDate atom-widget--header__select" style="width: 150px; font-family: ' Museo', sans-serif;" ng-model="selectedRange" ng-change="dateFilter(selectedRange)"> 



              <option value="week" selected>This week</option>
              <option value="month">This month</option>
              <option value="year">This year</option>
              <option value="custom">Custom</option>
            </select>
</div>

Вам не нужно сравнивать значение $ scope val, вместо этого передайте измененное значение ng-change в функцию контроллера dateFilter (selectedValue).

Также не забывайте, что == обычно не то, что вы хотите для сравнений, и = никогда. Почти всегда используйте ===, если вы не хотите использовать javascripts, встроенные в принуждение типа.

Твой был близок! http://jsfiddle.net/geub5cxk/1/

Alpha G33k 01 июль 2015, в 13:44

Ещё вопросы

Rashedul.Rubel · Accepted Answer · 2015-07-01T14-44-00.000Z

В состоянии месяца, года у вас отсутствует оператор "=="

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
    $scope.dateFilter = function () {
        //alert("Hello");
      $scope.customDate = false;
      var oneWeekAgo = new Date();

      if ($scope.selectedRange == 'week') {
          alert("week");
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setDate(oneWeekAgo.getDate() - 7);
      }
      if ($scope.selectedRange == 'month') {
          alert("month");
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setMonth(oneWeekAgo.getMonth() - 1);
      }
      if ($scope.selectedRange == 'year') {
          alert("year");
        $scope.searchStartDate = new Date();
        $scope.searchStartDate.setYear(oneWeekAgo.getYear() - 1);
      }

      if ($scope.selectedRange == 'custom') {
          alert("custom");
        $scope.customDate = true;
      }
    }
}