2016-05-06 2 views
-2

ボタンをクリックするたびに単に変更をトリガしたいだけです。変更はテキストを警告するだけです。しかし、トリガーがうまく動作しません。ここでAngularJSトリガの変更が動作しない

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

plunkerへのリンクされています:ここで

はコードである http://plnkr.co/edit/zErS4DaTgR79SBLbtGOy?p=preview

+0

をコピーするには、正確な問題がある質問でください説明してください。 – cst1992

+0

2つの回答が既に与えられているので、他の人はそれを理解している –

+0

質問はコミュニティ全体にとって有用でなければなりません。 1%の人があなたの質問を理解していて、99%があなたの質問に問題がないと思っていると思うなら、99%がdownvoteに行くでしょう。できるだけ明確な質問をするようにしてください。 – cst1992

答えて

1

はあなたの問題を解決します$タイムアウトを追加することにより、この

<script type="text/javascript"> 
     app = angular.module('myApp', []); 
     app.controller('myCtrl', function($scope,$timeout){ 
     $scope.sameAsAbove = function(primary, receiver){ 
      receiver['name'] = primary['name']; 
     }; 
     $scope.clickMe = function(){ 
     $timeout(function() { 
         angular.element(document.getElementById('changes')).triggerHandler('change'); 
    }, 100); 

     // x = angular.element(document.getElementById('changes')).val(); 
     // alert(x); 
     } 
     $scope.changeOver = function(){ 
      alert("deam"); 
     } 
     }); 
     $("#clickMe").click(function(){ 
     // alert("czxvzx"); 
     // $("#same").trigger("click"); 
     $("#changes").change(); 
     }); 
    </script> 

を試してみてください。

+0

これは驚くべきことです! $ timeoutはどのようにケースを解決しましたか? –

+0

というイベントがバインドされていないため、イベントがバインドされるのを待つ必要があり、それが問題になります。 –

+0

ああ大変ありがとう! –

-1

あなたはそれをこのように行うことができます -

$scope.clickMe = function(){ 
     var scope = angular.element("#changes").scope(); 
     scope.changeOver(); 
     //angular.element(document.getElementById('changes')).triggerHandler('change'); 

} 

作業がhere

関連する問題