関数のパラメータはAngularjsで魔法のように一致しますか？

Question

私はangualarjsを初めて使い、anglejs 1.5コンポーネントを使用してページを作成し始めました。私は、複数の例から次の例を理解しようとしています。 angularjsは部分的なアプリケーション/カリングなどでjavascriptを拡張していますか？

映画-rating.component.html： 機能model.setRating()はvalueのプロパティを持つオブジェクトに渡されます。

<span ng-repeat="entry in model.entries track by $index"> 
    <span ng-click="model.setRating({ value: $index + 1})" class="glyphicon {{entry}}"> 
    </span> 
</span> 

映画-rating.component.js： setRatingは "&" を使用してバインドされています。

module.component("movieRating", { 
    templateUrl: "/ps-movies/movie-rating.component.html", 
    bindings: { 
     value: "<", 
     max: "<", 
     setRating: "&" 
    }, 

映画list.component.html：コンポーネントを使用する場合 しかしながら、set-ratingは偶然にmodel.setRating(movie, value)と機能が割り当てられていますか？映画は実際には<tr ng-repeat="movie in model.movies">の値ですか？しかしvalue？

<tr ng-repeat="movie in model.movies"> 
    <td>{{movie.title}}</td> 
    <td>{{movie.length}}</td> 
    <td> 
     <movie-rating value="movie.rating" max="5" set-rating="model.setRating(movie, value)"> 
     </movie-rating> 
    </td> 

映画-list.component.js： 次のコードmodel.setRating = function(movie, rating)で、valueのプロパティを持つオブジェクトに想定何らパラメータがありませんか？

function controller($http) { 
    var model = this; 
    model.movies = []; 

    model.$onInit = function() { 
     fetchMovies($http).then(function(movies) { model.movies = movies; }); 
    }; 

    model.upRating = function(movie) { if(movie.rating < 5) { movie.rating += 1; } }; 
    model.downRating = function(movie) { if(movie.rating > 1) { movie.rating -= 1; } }; 

    model.setRating = function(movie, rating) { // rating is int, and movie is string 
     movie.rating = rating; 
    }; 

Answer 1

AngularJSでは、&でバインドされた式はパラメータの順序で実行されません。代わりに、このようにバインドされた関数を実行するときは、オブジェクトで実行する必要があります。

<movie-rating set-rating='model.setRating(movie, value)'></movie-rating> 

今、あなたのmovie-ratingコンポーネントがsetRating機能を受け取り、そのコントローラーに割り当てます、のはあなたの例を見てみましょう。あなたがmovieRatingコントローラの内部で$ctrl.setRating()を実行すると、角度はそれを

{ movie: 0, value: 0 } 

のようなオブジェクトを渡すことを期待しようとしていることは、set-ratingに渡された文字列で指定されたパラメータの順に、これらの値をマッピングします。言い換えれば、Angularはmodel.setRating(movie, value)を受け取り、実際にはmovieキーの値を渡されたオブジェクトから最初のパラメータに渡し、valueオブジェクトを2番目のパラメータに渡す必要があることを確認します。

spanをmovie-ratingの中にクリックすると、setRating({ value: $index })が呼び出されます。 movieundefinedのままになるので、親関数movieList.setRatingは(undefined, $index)というパラメータを受け取ります。

この式の結合動作（式の中にあるmovieとvalueの名前が保持されている）は、テンプレートにのみ適用されます。このため、JavaScriptコードではAngularが渡らないことがわかります。

---

テンプレートに結合機能で値名を使用する場合、基本的にこのtldr、角度は、関数の呼び出しに渡されたオブジェクトを展開し、名前を経由してパラメータを一致しますします。 &バインディングの場合にのみ実行し、jsオブジェクトを&バインディング（HTMLで定義する必要があります）にアンパックします。 JSオブジェクトを通常のJS関数にアンパックしません（HTMLバインディングは変換されませんが、実行時にJS変数名が変更されるので、$ injectや配列構文を使用する必要があります）アンギュラ）

私はここに