使用工廠數據填充控制器的正確方法？

我有一個Angular工廠，它只是使用$http服務從服務器上的靜態json文件中獲取數據。使用工廠數據填充控制器的正確方法？

module.factory('ShowsProvider', function ($http) { 
    return { 
     get: function() { 
      return $http.get('/static/shows.json'); 
     } 
    }; 
});

我然後有一個控制器，該注入工廠，並調用上述定義的其get()方法。

module.controller('RegisterController', ['ShowsProvider', function (ShowsProvider) { 
    var vm = this; 
    vm.shows = []; 

    ShowsProvider.get().then(function (shows) { 
     vm.shows = shows.data; 
    }); 
}]);

這很有效，但在我的控制器中有這樣的自由浮動函數調用感覺很尷尬。在Angular中是否有某種模式可以更乾淨地調用這個工廠，並將數據提供給我的控制器？或者是我有一個「可接受的」方法？

來源

2016-05-19 mariocatch

這是可以接受的 - 你總是可以將這個調用包裝在一個被調用的函數中 - 但除此之外，它是一個好的。您還可以擴展在服務層調用的'.then（）'，以防止有任何數據按摩需要完成。 – tymeJV

你可能會喜歡$ resource稍微好一些，但你基本上仍然在某處調用函數。 – Casey

始終善於解決控制器中的承諾。如果你必須做一些預處理，你可以在工廠中添加一些邏輯，如在這個最佳實踐中描述 - > https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#data-服務 – rick

使用ngRoute或UI路由器時可以處理這個問題。路由器負責解析解析器的承諾，狀態/路由解析器作爲解析值被注入狀態/路由控制器。

$routeProvider.when('...', { 
    resolve: { 
    showsResolver: (ShowsProvider) => ShowsProvider.get() 
    }, 
    controller: function (showsResolver) { 
    this.shows = showsResolver; 
    } 
    ...

即使在小型應用中使用路由器也是其中一個原因。如果這不是一種選擇，那麼最初的方法是在控制器中解開承諾的建議方式。

來源

2016-05-19 15:42:49 estus

當然，可以將工廠功能稱爲您的工廠功能。

我通常在IIFE（即時調用的函數表達式）中包含這種浮動函數。

module.controller('RegisterController', ['ShowsProvider', function (ShowsProvider) { 
    var vm = this; 
    vm.shows = []; 

    (function() { 
     ShowsProvider.get().then(function (shows) { 
       vm.shows = shows.data; 
     }); 
    })(); 
}]);

該IIFE在控制器加載時執行。但是，有時會發生，我需要再次調用一個自由浮動函數（例如在執行一些ng-click操作之後）。這就是爲什麼，我將這個自由浮動函數放在一個賦給變量的匿名函數中。因此，它可以幫助您在控制器加載或控制器加載後調用。

module.controller('RegisterController', ['ShowsProvider', function (ShowsProvider) { 
    var vm = this; 
    vm.shows = []; 

    vm.getShows = function() { 
     ShowsProvider.get().then(function (shows) { 
       vm.shows = shows.data; 
     }); 
    } 

    // suppose some ng-click operation calls this 
    vm.deleteShow = function(show) { 
     // suppose a deleteShow function is there in ShowsProvider 
     ShowsProvider.deleteShow({showId: show.id}).then(function (shows) { 
      // if you want to retrieve the shows again  
      vm.getShows(); 
     }); 
    } 

    (function() { 
     vm.getShows(); 
    })(); 
}]);

還有一些其他的好技術。但是，這一切都歸結於你的喜好。

來源

2016-05-19 15:47:33 Saad

使用工廠數據填充控制器的正確方法？

回答

相關問題