2

簡単な質問ですみません。私は初心者で、答えを見つけるために検索する正しいことをおそらく理解していません。

私は基本的にこの angularJS チュートリアルに従いましたhttp://www.youtube.com/watch?v=i9MHigUZKEM

コントローラーに接続するファクトリーのセットアップを除いて、すべてをやり遂げました。

ファクトリのコードは次のとおりです。

    demoApp.factory('simpleFactory', function(){
    var people = [
          { name: 'Will', age: '30' },
          { name:'Jack', age:'26' },
          { name: 'Nadine', age: '21' },
          { name:'Zach', age:'28' }
        ];

  var factory = {};
  factory.getPeople = function() {
    return people;
  };
});

コントローラーは次のとおりです。

    demoApp.controller('FirstCtrl', ['$scope', 'simpleFactory', function ($scope, simpleFactory) {

    $scope.people = simpleFactory.getPeople();        
    }]);

そして、HTML で単純に繰り返すだけです。

Name:
   <input type="text" ng-model="filter.name"> {{ nameText }}
   <ul>
      <li ng-repeat="person in people | filter:filter.name | orderBy: 'name'">{{ person.name }}- {{ person.age }}</li>
   </ul>

私が得るエラーは、javascript コンソールで「TypeError: 未定義のメソッド 'getPeople' を呼び出せません」です。

注:これは、コントローラー内で次のようにハードコードされたデータオブジェクトがある場合、すべて正しく機能します。

    demoApp.controller('FirstCtrl', ['$scope', 'simpleFactory', function ($scope, simpleFactory) {

    $scope.people = [
      { name: 'Will', age: '30' },
      { name:'Jack', age:'26' },
      { name: 'Nadine', age: '21' },
      { name:'Zach', age:'28' }
    ];        
 }]);
4

2 に答える 2

0

基本的に、'factory' オブジェクトから return ステートメントが欠落しているだけですが、混乱を避けるために少し名前を変更すると、より明確になる可能性があります。

例、AngularJSの本から改作:

demoApp.factory('People', function(){ // Renamed factory to be more descriptive
  var people = {}; // Renamed 'factory' to 'people', as an object we can prototype more functions later

  people.query = function() { // called query, but could be getPeople
    return [ // just return a static array for now
      { name: 'Will', age: '30' },
      { name:'Jack', age:'26' },
      { name: 'Nadine', age: '21' },
      { name:'Zach', age:'28' }
    ];
  }

  return people;
});

これで、コントローラーがこの情報を取得できるようになりました。

demoApp.controller('FirstCtrl', ['$scope', 'People', function ($scope, People) { // dependency injection
  $scope.people = People.query();
});

これで、クエリと呼ばれるオブジェクトを返す People の記述ファクトリができました。後でこのクエリ関数を更新して、パラメーターを読み込み、AJAX 呼び出しを開始し、いくつかの複雑なことを行うことができます。しかし、一度に一歩:)

于 2014-02-27T04:47:32.693 に答える