jQueryが..私は問題にこだわっています、私のHTMLページ

Question

で働いていません。なぜこれが起こるのですか？

$('#setting').change(function() { 
 
    alert("hi"); 
 
});

<div class="content table-responsive table-full-width"> 
 
    <table class="table table-hover table-striped"> 
 
    <thead> 
 
     <th>Settings</th> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td> 
 
      <select id="setting" class="form-control"> 
 
      <option>---Select---</option> 
 
      <option ng-repeat="item in settings" value="{{item.id}}">{{item.name}}</option> 
 
      </select> 
 
      <div id="btn" class="col-md-12" style="margin-top: 16px;"> 
 
      <input type="button" name="Activate" value="Activate" /> 
 
      <input type="button" name="Deactivate" value="Deactivate" /> 
 
      </div> 
 
     </td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>

これで私を助けてください。あなたがへのより良い、その後angularjsで起動している場合

$scope.functionToCall = function(){ 
    alert('hi'); 
}; 

---

：

<select id="setting" class="form-control" ng-change='functionToCall()'> 

と、コントローラのスコープオブジェクトがこのfuncitonを追加で：事前

Answer 1

のおかげでは、代わりにちょうどng-changeディレクティブを使用しますjqueryスタイルのコードを残します。 Angularjsはjqueryとは異なる方法です。

これは良い出発点です。 "Thinking in AngularJS" if I have a jQuery background?

Answer 2

これは、まだ作成されていないDOM要素に対してjQueryを使用するとよく発生します。

あなたのウェブページがロードされると、Angular（おそらく）はキックインされず、あなたのドロップダウンリストにまだ入力されません。

代わりに、Angularのng-changeを使用します。次に、ドロップダウンリストで項目を選択すると、の機能がになります。

私はここに、この例を持っている：、コード

を移入するために：ここで

Angular tutorial

、私は、ユーザーが新しい顧客を選択するたびに、顧客の詳細情報を更新しますリストを選択し、選択した項目が変更されたときに関数を呼び出すと、次のようになります。

<select ng-model="selectedCustomer" 
     ng-change="loadOrders();" 
     ng-options="customer as customer.CompanyName for customer in listOfCustomers" > 
    </select>