web-dev-qa-db-ja.com

関数を介したng-init

ご存じのように、次のようにオブジェクトを初期化することができます。

<div ng-init="friends = [{name:'John', phone:'555-1276'},
                         {name:'Mary', phone:'800-BIG-MARY'},
                         {name:'Mike', phone:'555-4321'},
                         {name:'Adam', phone:'555-5678'},
                         {name:'Julie', phone:'555-8765'},
                         {name:'Juliette', phone:'555-5678'}]"></div>

このようなオブジェクトを定義することは可能ですが、関数を介して可能です:

<div ng-init="init()">

私の目的は、実際にAPIからオブジェクトを取得し、ng-repeatを介してリストに表示することです

12
Asqan

documentation は、_ng-init_が任意の式を取ると言います。そのため、関連するスコープでinit()という関数が定義されている限り、上記の操作を実行できます(また、楽しみのために検証しました)。

ドキュメンテーションには、_ng-init_は実際には_ng-repeat_内のプロパティのエイリアスにのみ使用されることを意図していることに注意してください:

以下のデモに見られるように、ngRepeatの特別なプロパティのエイリアスにngInitを使用する唯一の適切な方法。この場合のほかに、ngInitではなくコントローラーを使用して、スコープの値を初期化する必要があります。

最後に、コントローラーの作成時に変数を簡単に初期化できることに注意してください。したがって、_ng-init_を使用する必要はまったくありません。例えば:

_var myApp = angular.module('myApp', []);

myApp.controller('myController', ['$scope', function($scope){

  $scope.init = function() {
    $scope.a = 'Apples';
    $scope.b = 'Bees';
    $scope.c = 'Zebras';
  };
  // runs once per controller instantiation
  $scope.init();

}]);
_
21
Sunil D.

したがって、ng-initを使用する必要はまったくありません。

ビューにデータを渡すことで何かを初期化したい場合があります。これは、.NET MVCなどのテンプレートページで使用でき、.NETからangular(コントローラには既にデータがあり、最も簡単な方法はこれをViewBagに渡すことです。

これを行うには「正しい」方法はラウンドアバウトであり、ページに固定IDのスクリプトタグを埋め込み、javascript/jqueryを使用してコントローラーのスコープにデータをプルする必要があるため、保守が困難です。コード化されたID。

いずれにせよ、アンギュラーのMVWパターンが壊れる(まあまあ)。

6
EnderWiggin