我應該如何使用我在angularjs $ watch（）函數內觀看的變量

Question

我一直在學習如何使用angularjs中的指令來使用教程here和here包含jQuery插件。我正在嘗試合併fullCalendar，並且我已成功獲取了日曆初始化並顯示，但現在我有點卡住了。我目前正在從json文件中獲取數據（最終會來自工廠和php獲取響應），但我不確定如何在我的指令中引用json數據，並且需要一些指導。

目前我有以下，但什麼是正確/最好的方法不硬編碼和保持靈活性。我知道我可以在指令中提出$http.get()請求，但我覺得我不應該用我的指令提出任何請求（除非有人能說服我這種做法並不是不好的做法）

這是我目前directive.js（請沒有的getJSON（）是僅用於測試）

angular.module('Directives', []) 
    .directive('mycalendar', function() { 
    getJSON = function() { 
     return [{ 
      "title": "Fitness", 
      "start": "2013-08-01 06:30:00", 
      "instructor": "3" 
     }] 
    } 

    var linker = function (scope, element, attr) { 
     scope.$watch('classesList', function() { 
      /**/ 
      element.fullCalendar({ 
       header: { 
        left: 'prev,next today', 
        center: 'title', 
        right: 'month,agendaWeek,agendaDay' 
       }, 
       editable: true, 
       events: getJSON() 
       /**/ 
      }); 
     }); 
    } 
    return { 
     restrict: 'A', 
     link: linker 
    } 
}); 

我的控制器：

angular.module('Controllers', []) 
    .controller('CalController', function ($scope, $http) { 
    $scope.url = 'json/classes.json'; 
    $scope.classesList = []; 

    $scope.fetchClasses = function() { 
     $http.get($scope.url) 
      .then(function (result) { 
      $scope.classesList = result.data; 
     }); 
     $scope.fetchClasses(); 
    } 
}); 

我的HTML：

<div id="container" ng-controller="CalController"> 
    <div id='calendar' mycalendar></div> 
    </div> 

Answer 1

相同的全日曆可作爲模塊@https://github.com/angular-ui/ui-calendar

請看看它

或者

檢查以下URL

http://jsfiddle.net/joshkurz/xqjtw/59/

檢查上面的URL的控制器部分：

$scope.eventSource = { 
      url: "http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic", 
      className: 'gcal-event',   // an option! 
      currentTimezone: 'America/Chicago' // an option! 
     }; 

這裏的「$ scope.eventSource」是靜態的，你可以把它通過動態創建的服務功能和使用$ HTTP和控制器

下面

注射服務功能是相同的例子：

app.factory('myService', function($http) { 
    return { 
    getList:function(params){ 
      var promise= $http({url: 'ServerURL',method: "POST", params: params}).then(function(response,status){ 

      return response.data; 
      }); 
      // Return the promise to the controller 
      return promise; 
     } 
    } 
}); 

app.controller('MainCtrl', function($scope, myService) { 
    myService.getList(function(data) { 
    $scope.eventSource = data; 
    }); 
});