2016-05-06 4 views
1

Я пытаюсь выполнить скрипт, который скопирует значение одной модели тега-тега в другую, а затем запустит ее функцию изменения ng с помощью флажка. Что происходит, когда вы нажимаете этот флажок, он копирует значение, но триггер больше не работает. Похоже, что существует конфликт между установкой значения модели и выполнением триггера, потому что либо один из них терпит неудачу.AngularJS select change trigger

Вот мой код:

<!DOCTYPE html> 
<html ng-app="myApp"> 

    <head> 
    <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
    </head> 

    <body ng-controller="myCtrl"> 
    <select ng-model="first.selection" id="first" ng-change="changeOver('dean')"> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> <br /> 
    <input type="checkbox" ng-model="same" id="same" ng-change="sameAsAbove(first, second)"> Same as above <br /> 
    <select ng-model="second.selection" id="second" ng-change="changeOver('armada')"> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 
    <!-- <span id="clickMe">Click Me!</span> --> 
    <script type="text/javascript"> 
     app = angular.module('myApp', []); 
     app.controller('myCtrl', function($scope, $timeout){ 
     $scope.first = {}; 
     $scope.second = {}; 
     $scope.sameAsAbove = function(primary, receiver){ 
      receiver['selection'] = primary['selection']; 
      $timeout(function() { 
       angular.element(document.getElementById('second')).triggerHandler('change'); 
      }, 100); 
     }; 
     $scope.changeOver = function(value){ 
      alert(value); 
     } 
     }); 
     $("#clickMe").click(function(){ 
     // alert("czxvzx"); 
     // $("#same").trigger("click"); 
     $("#changes").change(); 
     }); 
    </script> 
    </body> 
</html> 

Вот plunkr URL: http://plnkr.co/edit/zErS4DaTgR79SBLbtGOy?p=preview

ответ

1

В DOM тела вы должны изменить эту строку, как это.

<select ng-model="second.selection" id="second" ng-change="same=second.selection"> 

и использование часов, чтобы изменить значение флажок

$scope.$watch("same", function(newValue, oldValue){ 
     $scope.changeOver('armada'); 
     //or do anything 

    }); 

plunker demo link

+0

Вау спасибо! Я никогда не знал $ scope. $ Watch. Большое спасибо! –