javascript - AngularJS 指令范围数据 Ng-Repeat

Question

我正在将数据从应用程序传递到指令，并尝试呈现在 $http 结果上传递的数据。当我将数组记录在指令的范围内时，我可以看到它的值，但我无法获取要呈现的列表项。

import angular from 'angular';
(function () {
  'use strict';

  angular
    .module('app', [])
    .controller('HomeCtrl', ['$http', '$scope', HomeCtrl])
    .directive('animals', [
      '$http',
      function ($http) {
        return {
          restrict: 'E', 
          controller: function ($scope) {
            console.log('&&&');
            console.log($scope);
          },
          template:
            '<li class="service-item ng-repeat="animal in testData">' + 
            '{{animal.label}}' +
            '</li>'
        };
      }
    ]);
    

  /**
   * Home controller.
   * @param {*} $scope
   */

  function HomeCtrl($http, $scope) {
    $scope.testData = [];

    //get mock data for testData
    $http.get('lib/testData.json').then(function (response) {
      $scope.testData = response.data;
    });

  }
})();

http://plnkr.co/edit/rY0ns6RyOJS82f28?open=lib%2Fscript.js&deferRun=1

标签： javascriptangularjsangularjs-directive

Answer 1

你错过了一个双引号，它是li class="service-item"