1

У меня есть выпадающий список, который должен сменить ползунок (угловое пятно). Меню выбора отображает выбор, и когда выбор сделан, слайды не обновляются. Я использую угловой 1.3.0.ng-model not update value

Я считаю, что я сузил это до модели, не обновляя значение.

Вот мой HTML:

<select class="form-control" ng-options="d.id as d.category for d in draggableObjects | object2Array | orderBy:'id'" ng-change="updateSlide()" ng-model="selectedSlideId"></select> 

      <slick class="slider" objs="obj" data="draggableObjects" settings="slickConfig" ng-if="slideLoaded"> 
       <li ng-repeat="obj in draggableObject.item" class="draggable-item slide"> 
        <div ng-drag="true" ng-drag-data="obj" data-allow-transform="true"> 
         <img ng-src="{{obj.src}}" alt="{{obj.name}}"> 
         {{obj.name}} 
        </div> 
       </li> 
      </slick> 

Вот инициализации и функция, которая должна обновить модели для запуска нг-изменения:

// selection from the select dropdown 
     $scope.$watch('selectedSlideId', function(newVal, oldVal) { 
      if (newVal !== oldVal) { 
       $scope.draggableObject = $scope.draggableObjects[newVal]; 
       console.log('finally!'); 
      } else { 
       $scope.draggableObject = $scope.draggableObjects[1]; 
       console.log('id not updated'); 
      } 
     }); 
     // init dashboard 
     $scope.selectedSlideId = '1'; 

А вот объект JSON, что сортируется через:

// draggable objects 
    $scope.draggableObjects = { 
     1: { 
      id: '1', 
      category: 'Slider', 
      item: [ 
       {name:'slider one', src: 'images/placeholderslider.png'}, 
       {name:'slider two', src: 'images/placeholderslider2.png'}, 
       {name:'slider three', src: 'images/placeholderslider3.png'}, 
       {name:'slider four', src: 'images/placeholderslider4.png'}, 
       {name:'slider five', src: 'images/placeholderslider5.png'} 
      ] 
     }, 
     2: { 
      id: '2', 
      category: 'News', 
      item: [ 
       {name:'news one', src: 'images/placeholdernews.png'}, 
       {name:'news two', src: 'images/placeholdernews2.png'}, 
       {name:'news three', src: 'images/placeholdernews3.png'}, 
       {name:'news four', src: 'images/placeholdernews4.png'}, 
       {name:'news five', src: 'images/placeholdernews5.png'} 
      ] 
     } 
    }; 

Угловая пятно, похоже, обновление с помощью нг-если и тайм-аут:

// init and reInit slick 
    $scope.slideLoaded = true; 
    $scope.updateSlide = function() { 
     $scope.slideLoaded = false; 
     console.log('slide update'); 
     $timeout(function() { 
      $scope.slideLoaded = true; 
     }); 
    }; 

В консоли я получаю «идентификатор не обновляется» (от инициализации выбора), и «обновление слайдов», когда выбор производится из выпадающего списка, когда я должен видеть «в конце концов!» от модели, изменяющей выбранное значение.

Цените любую помощь.

ответ

0

У меня также была эта проблема при использовании $scope.$watch('modelname' ,... Я в настоящее время использовать эту функцию -

$scope.$watch(
    function(){ return $scope.modelname;}, function(newVal, oldVal){ 
    ....... 
    } 
) 

написание function вернуться model вместо modelname (строк) .Это никогда не выходит из строя.

+0

Спасибо за предложение. Я переработал сценарий и, к сожалению, я до сих пор не вижу обновления моих слайдов, при этом консольная печать «id not updated». Я удалил свои фильтры (думая, что могу возвращать неправильный тип значения), но все равно не вижу «наконец!». печать на консоль. Кажется, что newVal, и oldVal не сравниваются. – zach57

+0

Хорошо, я поймал не то, что случилось со мной. Если в сравнении была проблема, а 'oldVal',' newVal' - строка, вы должны сравнивать с методом 'str1.equals (str2)' не с '=='. –

+0

Есть ли способ опубликовать обновленный код? Я бы очень признателен. – zach57

 Смежные вопросы

  • Нет связанных вопросов^_^